/* common */
*{ margin: 0;padding: 0}
a, img a{ text-decoration : none;color: #006666}
a.line{text-decoration : underline;}
ul, ol { list-style : none}
img { vertical-align : top}

/* html base */
html {font-family:'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', verdana, sans-serif;font-size : 100%;}
img{ max-width : 100%;border: 0;}
body, .center{text-align: center;min-width:320px;}
strong{font-weight: bold;;color: #FF0000;}
.center{text-align: center;}
.smaller, .small{font-size:smaller}
p.nextpage a{text-decoration : none}
.right{text-align:right}

/* clearfix */
.clearfix:after{ content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clearfix	{display: inline-block;min-height: 1%;}
* .clearfix{height: 1%;}
.clearfix	{display: block;}

/* Heading */
h2,h3{color: #006666;padding: 3px 0;margin-bottom : 25px;border-bottom: 3px solid #339999;text-shadow: 0 2px 3px #ccc;text-align: center;} 

h3{border-top: 3px solid #339999;}

/*  Header */
header { text-align : center;background:#F2F9F8;overflow:hidden}
header p{color:#339999;font-size: smaller;text-align : center;;margin:0 auto;padding-top: 10px;padding-left: 250px;}

/*  navi */
#navi{background: #339999;clear:both;margin:0}
nav ul{width:100%;margin: 0 auto;text-align:center;overflow : hidden;width :100%;max-width:1000px;}nav li{float:left;border-right: 1px solid #F2F9F8;;border-bottom:none;margin:auto;}
nav li a {padding : 15px 0;color:#fff;display:block;}
nav li a:hover{background: #006666}

#category strong{display:block;}
#category a strong{color: #006666}
#category p{margin-bottom: 30px;}


/* Back to top button */
#back-top {position: fixed;right: 15px;bottom:15px}
#back-top span {width: 56px;height: 59px;display: block;background: url(https://suukiso.com/images/up-arrow.png) no-repeat;}
#back-top a:hover span {background: url(https://suukiso.com/images/up-arrow2.png) no-repeat;}
#back-top a{text-decoration: none;}


/* Contents */
#contents{clear:both;max-width : 1000px}
#main {text-align : left}
section{margin-bottom: 5em;}

/* table */
.diagram{text-align:center;margin: 0 auto 25px;}
table{border-collapse:collapse;width:98%;margin: 0 1%;border:1px solid #99cccc;}
th{background:#99cccc;color:#006666;}
td, th{;border:1px solid #99cccc;padding: 2px 1px;width:50%;}

p{line-height: 150%;color:#333333;text-align : left;}
.break{word-break: break-all}
li{line-height: 100%;margin: 30px auto}
#contents ul{list-style-type:disc;margin: 0 0 25px 30px}
#contents ol{list-style-type:decimal;margin: 0 0 25px 30px}
.noliststyle{list-style-type:none;}


/* formula */
#box, #box2{ display:none;}
.fx{padding: 0 15px;}
.question{display:block;;border:1px solid #333333;background:  url(https://suukiso.com/images/question.png) no-repeat right top;padding:7px 50px 7px 5px;margin: 0 0 25px;}
.answer{display:block;border-bottom: 1px solid #999999;padding:7px 50px 7px 5px;;background: #fff url(https://suukiso.com/images/answer.png) no-repeat right top;padding:5px 2px;}

p.nextpage{text-align:center;font-size: smaller;margin: 0;background:#f6f6f6;}

/* blockquote */
.basis .quotetitle{text-align:center;font-weight: bold;background:#99cccc;color:#006666;;padding: 5px;margin-bottom: 20px;}
.basis {background: #F2F9F8 ;text-align:left;padding-bottom: 10px;}
blockquote p{margin: 20px 5px;;}
blockquote p a{text-decoration:underline;padding: 0 2px;}
.basis  strong{color:#fff;background:#339999;padding: 0 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;margin: 0 5px;}

blockquote section{border-bottom:1px solid #339999}

.point .quotetitle{text-align:center;font-weight: bold;background:#ffcc00;color:#cc0000;;padding: 5px;margin-bottom: 20px;}
.point {background: #ffffcc ;text-align:left;padding-bottom: 10px;}
.point  strong{color:#fff;background:#ff6600;padding: 0 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;margin: 0 5px;}


/* color */


/* Ads */
aside {text-align:center;margin: 0 auto 5px;clear:both}
aside li{text-indent:0;text-align:center;color:#cccccc;font-size:x-small}
.social {text-align:left;margin: 0 auto 5px;width:310px}

.suukiso-menu { width: 300px; height: 250px; }
@media(min-width: 336px) { .suukiso-menu { width: 336px; height: 280px; } }
@media(min-width: 600px) { .suukiso-menu { width: 180px; height: 150px; } }
@media(min-width: 650px) { .suukiso-menu { width: 200px; height: 200px; } }
@media(min-width: 790px) { .suukiso-menu { width: 250px; height: 250px; } }
@media(min-width: 950px) { .suukiso-menu { width: 300px; height: 250px; } }
@media(min-width: 1050px) { .suukiso-menu { width: 336px; height: 250px; } }
.suukiso-header { width: 300px; height: 50px; }
@media(min-width: 480px) { .suukiso-header { width: 468px; height: 60px; } }
@media(min-width: 800px) { .suukiso-header { width: 728px; height: 90px; } }
@media(min-width: 800px) { .suukiso-header { width: 970px; height: 90px; } }

/*  sub */
#sub ul, #sub ol{margin:0;}
#sub{text-align:left;padding:0;}
#sub li{list-style-type:none;margin: 0;}
#sub li:last-child{border-bottom:none;}
 #sub li a{display:block;padding:8px 5px;}
#sub li.mokujiindex{color:#fff;text-align:center;font-weight:bold;background:#339999;font-size:100%;;text-indent: 0;padding: 0}
#sub li.mokujiindex a{color:#fff;padding:8px 5px;}
#sub li.mokujiindex a:hover{background: #006666;}
#sub li a:hover{background: #F2F9F8}

/*  Footer */
footer {padding : 15px 0;color : #006666;font-size:xx-small;;background : #99cccc}
footer a {color: #006666}


@media screen and (min-width : 230px){
h3{display:block}
/*  navi */
nav li{float:left;width:16%;}
nav li:first-child{border-left: none}
nav li:last-child{border-right: none}
nav li{font-size: x-small}
.onlym{display:inline}
.hide4mobile, header p, .hide4mi{display:none;}
blockquote{;margin:0 0 10px;font-size:95%;}
h1{;text-align:center;}
h1 img{float:left;width:65px;height:30px}
h2{font-size: 100%;}
p{;margin : 0 5px 25px}
blockquote li{margin: 10px auto 30px;;}
#sub li{border-bottom:1px solid #F2F9F8;text-indent: 0.5em;font-size: 88%}
.go2top{font-size:small;text-align:center;margin: 10px;}
#sub h3{margin-bottom:0;}
header #search{text-align:right;padding-top:2px}
}

@media screen and (min-width : 600px){
.hide4mi{display:inline}
.onlym{display:none;}
h1 img{float:left;}
header p{display:block;padding:0;font-size: 75%;}
header p span{display:none}
nav li{font-size: small}
blockquote{;margin:0 0 24px;}
h2{font-size: 140%;}
blockquote li{margin: 10px auto 20px 30px;;}
}

@media screen and (min-width : 730px){

h1 img{width:145px;height:70px;}
h2{border-top: 3px solid #339999;}
#contents {overflow : hidden;;margin: 0 auto;;padding-top: 10px}
#main{float : right;width : 64%;}
#sub {float : left;width : 32%;}
#sub ul{margin-bottom: 30px;}
#sub li{border-bottom:none;font-size: 85%;text-indent: 0;margin:3px 0}
p{;margin : 0 5px 25px 0}
}

@media screen and (min-width : 1000px) {
h1{max-width:1100px;text-align:center;margin:auto}
h1 img{width:218px;height:100px;}
header{;margin:auto;}

header p span{display:inline}
#contents{padding-top: 20px;}

h3, .smallscreen{display:none}
.hide4mobile{display:block}
nav li{float:left;width:14.1%;}
nav li:first-child{border-left: 1px solid #F2F9F8}
nav li:last-child{border-right: 1px solid #F2F9F8}
nav li{font-weight:bold;}
#search{clear:right;text-align:right;margin:2px 1px 0 0}
}
 footer {line-height:35px}