@charset "UTF-8";
/* CSS Document */

img{width:100%;}

/*メイン画像*/
#main{margin:0 auto;}
.pc{display:block;}
.sp{display:none;}

/*メニュー*/
.sticky{width:25%; position:-webkit-sticky; position:sticky; top:10px; float:left; height:300px; padding:3%; text-align:left; margin-top:3%;}
.sticky h3{font-size:130%; padding-bottom:15%; font-family: 'Oswald', sans-serif;}
.sticky a{width:8%; display:block; margin:10% 0; color:#000; border-bottom:1px solid #000; font-family: 'Oswald', sans-serif;}

/*メインテキスト*/
#info-{width:100%; padding:10% 0; font-family: 'Kosugi Maru', sans-serif; text-align:center;}
#info- h2{font-size:130%; line-height:160%; font-family: 'Oswald', sans-serif;}
#info- img{width:25%; margin:3%;}
#info- p{font-size:80%; line-height:180%;}

/*LP*/
#lp{display:block;}

/*コーデ*/
#contents{display:block; border-bottom:1px solid #000; padding:10% 0; text-align:center;}
.text_in{margin:5% 0 5% 0; font-family: 'Noto Sans JP', sans-serif; font-size:80%; line-height:180%;}
.sub{width:50%; margin:0 auto 5% auto; clear:both;}
.speck{width:50%; margin:0 auto 3% auto;}
.speck h3{font-size:130%; margin-bottom:5%; font-family: 'Noto Sans JP', sans-serif;}
.code{width:50%; margin:0 auto;}
.code a{padding:3% 0;; display:block; border-bottom:1px solid #000; text-align:left; color:#000; font-family: 'Oswald', sans-serif;}
.code a b{float:right; font-weight:bold; background-color:#000; color:#fff; padding:1% 2%; font-size:80%; font-family: 'Oswald', sans-serif;}

/*tanktop*/
#tank{width:100%; padding:5% 0; font-family: 'Kosugi Maru', sans-serif; text-align:center;}
.tank_title{width:25%; margin:3%;}
#tank p{font-size:80%; line-height:180%;}
.tank_img{width:80%; margin:3%;}

/*最後*/
#end{margin:5% 0; padding:8% 0 5% 0; background-color:#E8E8E8;}
#end h3{width:50%; margin:0 auto;}
#end p{width:20%; margin:3% auto 0 auto;}

#category{max-width:1200px; margin:0 auto;}

@media screen and (max-width: 768px) {

	
/*メイン画像*/
.pc{display:none;}
.sp{display:block;}

/*メニュー*/
.sticky{top:22%; float:left; margin-top:10%;}
.sticky h3{font-size:95%; font-family: 'Oswald', sans-serif;}
.sticky a{font-size:90%; width:25%; margin:50% 0; font-family: 'Oswald', sans-serif;}

/*メインテキスト*/
#info-{width:100%; margin:0; padding:15% 0 25% 0; font-size:80%; font-family: 'Kosugi Maru', sans-serif;}
#info- h2{font-size:100%; line-height:130%; font-family: 'Oswald', sans-serif;}
#info- img{width:60%; margin:6% 0 10% 0;}
#info- p{font-size:80%; line-height:180%;}

/*コーデ*/
#contents{width:100%; padding-bottom:20%;}
.text_in{width:80%; margin:10% 5% 10% 15%; font-size:80%; line-height:170%; font-family: 'Noto Sans JP', sans-serif;}
.sub{width:80%; margin:10% 5% 10% 15%;}
.speck{width:80%; margin:10% 5% 10% 15%; margin-bottom:8%;}
.speck h3{margin-bottom:5%; font-size:100%;}
.code{width:80%; margin:10% 5% 10% 15%;}
.code a{font-size:80%; padding:5% 0;}

/*tanktop*/
#tank{width:100%; margin:0px 5%; padding:15% 0 25% 0; font-size:80%; font-family: 'Kosugi Maru', sans-serif;}
.tank_title{width:60%; margin:6% 0 10% 0;}
#tank .speck{margin:0 10%;}

/*最後*/
#end{margin-top:15%; padding:30% 0 30% 0;}
#end h3{width:80%; margin:0 auto;}
#end p{width:45%; margin:3% auto 0 auto;}
	
	
}