/* CSS Document */
* {
	margin: 0;
	padding: 0;
}
html, body {
	font-family:"ＭＳ Ｐゴシック", "ＭＳ ゴシック", sans-serif;
	background: url(../img/haikei.jpg);
	position: static;
	color: #894208;
	font-size:14px;
	line-height:1.5;
}


a:link {color: #cc6633;}
a:visited {color: #669933;}
a:active {color: #cc9900;}
a{text-decoration : none;
}

/*スティッキーヘッダ*/
#sticker{
    background: #fff;
    display: flex;
    padding: 5px;
    position: absolute;
    justify-content: space-between;	
    width: 100%;
    text-align: center;
}
#sticker.fixed{
    position: fixed;
    top: 0;
	z-index:99;	
}
/*Flex box*/
*, *:before, *:after {
	box-sizing: border-box;
}
.col {
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
	justify-content: center; /* 子要素をflexboxにより中央に配置する */
	align-items: start;  /* 子要素をflexboxにより中央に配置する */
	background-color: #fff;
	
}
.col > div {
	width: 16.6%;
}

.col_2 > div {
	width: 45%;
}	

.col_3 > div {
	width: 33.3333%;
}
.col > div > div {
	position: relative;
	overflow: hidden;
}
.col_s{
	justify-content: space-evenly;
	align-items: start!important; 	
}

.sticker_c{
	text-align: center;
	margin:0 auto;
}

/*category*/
#category ul, .button, .sub {
	width: 100%;
	display: table;
	table-layout: fixed;
	text-align: center;
	margin: 0px auto 5px auto;
	vertical-align: middle;	
}
#category li, .button li {
	display: table-cell;
	vertical-align: middle;
}


/*button*/
.button {
font-size:14px;	
}
.button a {
	padding: 5px 0;
}
.button a:link, .button a:visited {
font-family: "ＭＳ Ｐゴシック", "ＭＳ ゴシック";
 color:#894208 !important;
  display: inline-block;
  text-decoration: none;
  background-image: linear-gradient(#facd89 0%, #ffdba6 100%);
  border-bottom: solid 2px #e8c288;/*少し濃い目の色に*/
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
  font-weight: bold;
	margin: 5px 3px;
	border-radius: 15px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
}

/*Link-color*/
.button a:active {
  border-bottom: solid 2px #6699cc;
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}

#footer{
	padding-bottom:20px;
}

.pixiv{
background: linear-gradient(transparent 0, #F9F06D 0);
font-weight: bold;
}





/*------------------------▼スマフォ、タブレット用▼-----------------------*/
@media screen and (max-width: 768px) { /*ウィンドウ幅が最大749pxまでの場合に適用*/

	img{
	padding:5% 0 0 0 ;
	}
	
	
	#wrapper {
		height: auto;
		margin: 0px auto;
	}
	#wrapper, #wrapper img {
		width: 100%;
	}
	#wrapper a, #wrapper img {
		display: block;
	}
	
	/*区切り：背景白*/
	.enclosure {
		width: 97%!important;
		margin: 0 auto;
		padding:0 1%;
		text-align: center;
		background: #fff;
	}
	.sp_eyeout {
		display: none;
	}
	
	h1{
		font-size:20px;
		font-weight:bold;
	    border-bottom:solid 1px;
		padding-top:10%;
		margin:5% 0 ;
		width:80%;	

	}
h1:before{
  content: '-';
}

h1:after{
  content: '-';
}
	h2{
		font-size:15px;
		font-weight:bold;
        border-bottom:solid 1px;
		margin:5% 0 ;
		width:80%;
	}
	h3{
		font-size:15px;
	    border-bottom:solid 1px;	
		width:50%;	
		margin:10% 0 3% 0;		
	}		
	h4{
		font-size:12px;
		font-weight:bold;
		margin:5% 0 3% 0 ;	
	}		
h4:before{
  content: '●';
}	
	.ko{
		font-size:10px;
	}	
	
	.pixiv{
width:80%;
}	
	/*SP括弧閉じ*/
}
/*------------------------▼ＰＣ用▼-----------------------*/
@media screen and (min-width: 769px) { /*ウィンドウ幅が750px以上の場合に適用*/

	/*スティッキーヘッダ*/
	#site-header {
		padding: 3px;
	}
html, body {
	font-size:28px;
}
	
	#title {
		width: 100%;
		height: 150px;
		background: url(../img/main-1920-150.jpg) center no-repeat;
	}
	.small {
		font-size: 16px;
	}
	h1{
		font-size:36px;
		font-weight:bold;
	    	border-bottom:solid 1px;
		padding-top:30px;
		margin: 50px 0 30px 0;
		width:80%;	
	}
h1:before{
  content: '-';
	
}

h1:after{
  content: '-';
}
	h2{
		font-size:23px;
		font-weight:bold;
        border-bottom:solid 1px;
		margin:50px 0 ;
		width:80%;
	}
	h3{
		font-size:18px;
	    border-bottom:solid 1px;	
		width:50%;	
		margin:40px 0 5px 0;		
	}	
	h4{
		font-size:18px;
		font-weight:bold;
		margin: 10px 0 ;
	}	
h4:before{
  content: '●';		
}
	
	/*flexbox*/
	.col {
		width: 950px;
		margin: 0px auto;
	}
	.pc_eyeout {
		display: none;
	}
	.title_call {
		font-size: 18px;
		width: 93%;
	}
	/*CATEGORY*/
	#category {
		width: 960px;
		text-align: center;
		margin: 0 auto;
		font-size: 20px;
	}
	#category a {
		display: block;
	}
	#category ul, .button, .sub {
		width: 92%;
	}
	
	/*区切り：背景白*/
	.enclosure {
		width: 100%;
		background: #fff;
		padding: 30px 0px 30px 0px;
	}
	.img_3{
		width:100%;	
		display: block;
	}
	.efficacy {
		font-size: 15px;
	}
	.button {
		font-size: 20px;		
	}
	.ko{
		
		font-size:14px;
	}	
	.pixiv{
width:200px;
}
	
	/*PC括弧閉じ*/
}