@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Kosugi+Maru&display=swap');


/* common
-----------------------------------------------*/
*{
	line-height:1.8;
}
/*
a:link   {color:#35aaaf;text-decoration:underline;}
a:active {color:#35aaaf;text-decoration:underline;}
a:visited{color:#3c3c3c;text-decoration:underline;}
a:hover  {color:orange ;text-decoration:none;}
*/
.section div.inner{
	width:auto;
	margin:0 100px;
	padding:60px 0;
}
h2.ttl{
	font-family: 'Kosugi Maru';
	padding:0 0 10px 40px;
	padding:0 0 10px 0;
	color:#35aaaf;
	font-size:20px;
	border-bottom:1px #35aaaf solid;
	/*background:url(../images/icon_strawberry.png) no-repeat left top;*/
}

a.btn{
	display:block;
	width:40%;
	min-width:230px;
	margin:15px auto;
	padding:12px 15px 8px;
	color:#35aaaf;
	text-align:center;
	border:1px #35aaaf solid;
	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	-ms-border-radius:10px;
	transition:all 0.3 linear;
}
a.btn:hover{
	color:#fff;
	border:1px orange solid;
	background-color:orange;
}

@media screen and (max-width: 1054px){
	.section div.inner{
		margin:0 50px;
	}
}
@media screen and (max-width: 780px){
	.section div.inner{
		margin:0 30px;
	}
}
@media screen and (max-width: 350px){
	.section div.inner{
		margin:0 15px;
	}
}

/* slider
------------------------------------------------*/
.slider,
.thumb{
    width: 97%;
}
.slider{
	position:relative;
    margin: 80px auto 30px;
    width: 97%;
}
@media screen and (max-width:960px){
	.slider{
	    margin-top: 0;
	}
}
.thumb{
    margin: 0 auto 100px;
}
.slider img,
.thumb img{
	height: auto;
	width: 100%;
}
.thumb img{
	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	-ms-border-radius:10px;
}

/*slick setting*/
.slick-prev:before,
.slick-next:before{
    color: #000;
}
li.slick-slide{
	margin-left:10px;
	margin-right:10px;
}
@media screen and (max-width: 350px){
	.slick-dotted.slick-slider {
		margin-bottom: 50px!important;
	}
}

/* btn_fansite
------------------------------------------------*/
ul#btn_fansite{
	margin:60px auto -30px;
	text-align:center;
}
ul#btn_fansite li{
	margin:0 15px;
}
ul#btn_fansite li a.btn{
	width:15em;
}
@media screen and (max-width:660px){
	ul#btn_fansite{
		margin-bottom:0;
	}
	ul#btn_fansite li a{
		margin-bottom:0;
	}
}
@media screen and (max-width:540px){
	ul#btn_fansite li a.btn{
		font-size:14px;
		padding:12px 5px;
	}
}
@media screen and (max-width:350px){
	ul#btn_fansite{
		margin-bottom:30px;
	}
}

/* recomended
------------------------------------------------*/
div#recomended{}
div#recomended ul{}
div#recomended ul li{
	width:30%;
	margin:0 auto 60px;
	margin-right:5%;
}
div#recomended ul li:nth-child(3n){
	margin-right:0;
}
div#recomended ul li a{
}
div#recomended ul li a span{
	width:100%;
	display:block;
	margin-bottom:20px;
	text-align:center;
	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	-ms-border-radius:10px;
	overflow:hidden;
}
div#recomended ul li a span span.inner{
	display:block;
	width:100%;
	height:auto;
	margin:0;
	padding-top:100%;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	transition:all 0.3s linear;
}
div#recomended ul li a span span.inner:hover{
	width:110%;
	margin:-5%;
	padding-top:110%;
}
div#recomended ul li a h3{
	margin-bottom:10px;
	padding:0;
	color:#35aaaf;
	font-size:18px;
	text-decoration:underline;
	transition:all 0.3 linear;
}
div#recomended ul li a:hover h3{
	color:orange;
	text-decoration:none;
}
div#recomended ul li a p.text{
	font-size:12px;
}
p.category{
	width:100%;
	max-width:15em;
	margin-bottom:10px;
	color:#35aaaf;
	font-size:12px;
	text-align:center;
	border:1px #35aaaf solid;
	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	-ms-border-radius:10px;
}

@media screen and (max-width: 780px){
	div#recomended ul li a h3{
		font-size:16px;
		background:url(../images/arr.png) no-repeat left 0.5em;
	}
}
@media screen and (max-width: 510px){
	div#recomended ul li{
		width:47.5%;
		margin:0 auto 30px;
		margin-right:5%;
	}
	div#recomended ul li:nth-child(3n){
		margin-right:5%;
	}
	div#recomended ul li:nth-child(2n){
		margin-right:0;
	}
	div#recomended ul li a h3{
		font-size:14px;
		background:url(../images/arr.png) no-repeat left 0.4em;
	}
}
@media screen and (max-width: 350px){
	div#recomended{
		padding:0;
	}
	div#recomended ul li{
		width:100%;
		margin:0 auto 30px;
		margin-right:0;
		border-bottom:1px #ccc solid;
	}
	div#recomended ul li:nth-child(3n){
		margin-right:0;
	}
	div#recomended ul li:nth-child(2n){
		margin-right:0;
	}
	div#recomended ul li:last-child{
		border-bottom:none;
	}
}	
	

/* recomended2
------------------------------------------------*/
div#recomended2{}
div#recomended2 ul{}
div#recomended2 ul li{
	width:45%;
	min-height:100px;
	margin:0 10% 30px 0;
}
div#recomended2 ul li:nth-child(2n){
	margin-right:0;
}
	
div#recomended2 ul li a{
	position:relative;
	display:block;
	padding:10px 0 0 32%;
}
div#recomended2 ul li a span{
	width:25%;
	position:absolute;
	top:0;
	left:0;
	display:block;
	padding-top:25%;
	border-radius:50%;
	-webkit-border-radius:50%;
	-moz-border-radius:50%;
	-ms-border-radius:50%;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
}
div#recomended2 ul li a h3{
	margin-top:0;
}
@media screen and (min-width: 1230px){
	div#recomended2 ul li a{
		padding:0 0 0 25%;
	}
	div#recomended2 ul li a span{
		width:100px;
		height:100px;
		padding-top:0;
	}
}
@media screen and (max-width: 780px){
	div#recomended2 ul li{
		width:47.5%;
		margin:0 5% 30px 0;
	}
}
@media screen and (max-width: 510px){
	div#recomended2{
		padding:0 0 15px;
	}
	div#recomended2 ul li{
		width:100%;
		margin:0 0 15px;
		padding:0 0 15px;
		font-size:14px;
		border-bottom:1px #ccc solid;
	}
	div#recomended2 ul li:first-child{
		padding:15px 0;
		border-top:1px #ccc solid;
	}
	div#recomended2 ul li a {
		padding: 0 0 0 32%;
	}
	div#recomended2 ul li a span{
		width:20%;
		padding-top:20%;
	}
}	
@media screen and (max-width: 350px){
	div#recomended2 ul li a span{
		width:30%;
		padding-top:30%;
	}
}	


/* topics
------------------------------------------------*/
div#topics{}

div#topics dl{
	margin-bottom:30px;
	padding-bottom:15px;
	letter-spacing:-0.4em;
	border-bottom:1px #ccc solid;
}
div#topics dl dt,
div#topics dl dd{
	display:inline-block;
	*display:inline;
	padding:10px 0;
	font-size:16px;
	vertical-align:top;
	letter-spacing:normal;
	border-top:1px #ccc dotted;
	zoom:1;
}
div#topics dl dt:nth-child(1),
div#topics dl dd:nth-child(2){
	border-top:none;
}
div#topics dl dt{
	width:20%;
	padding-right:5%;
}
div#topics dl dd{
	width:75%;
}
@media screen and (max-width: 510px){
	div#topics dl dt,
	div#topics dl dd{
		width:100%;
	}
	div#topics dl dt{
		padding:10px 0;
	}
	div#topics dl dd{
		padding:0 0 10px;
		border-top:none;
	}
}




/* verygoodlocaltochigi
------------------------------------------------*/
div#verygoodlocaltochigi{
	width:auto;
	border-bottom:1px #35aaaf solid;
}
div#verygoodlocaltochigi div{
	width:auto;
	min-height:250px;
	margin-bottom:30px;
	background:url(../images/b_logo_b.png) no-repeat 120px top;
	background-size:150px auto;
}
div#verygoodlocaltochigi h3,
div#verygoodlocaltochigi p{
	width:auto;
	padding:0 120px 0 390px;
}
div#verygoodlocaltochigi h3{
	margin-top:50px;
	margin-bottom:15px;
	font-size:18px;
}
div#verygoodlocaltochigi p{
	margin-top:15px;
}

@media screen and (max-width: 1054px){
	div#verygoodlocaltochigi div{
		background:url(../images/b_logo_b.png) no-repeat 30px top;
		background-size:150px auto;
	}
	div#verygoodlocaltochigi h3,
	div#verygoodlocaltochigi p{
		width:auto;
		padding:0 0 0 230px;
	}
}

@media screen and (max-width: 510px){
	div#verygoodlocaltochigi div{
		padding:230px 0 0 0;
		background:url(../images/b_logo_b.png) no-repeat center top;
		background-size:150px auto;
	}
	div#verygoodlocaltochigi h3,
	div#verygoodlocaltochigi p{
		padding:0;
	}
}


/* hp
------------------------------------------------*/
div#hp{
	padding-top:90px;
	padding-bottom:0;
}
div#hp ul li{
	width:22%;
	margin:0 auto 30px;
	margin-right:4%;
}
div#hp ul li:nth-child(4n){
	margin-right:0;
}
div#hp ul li a{
	text-decoration:none;
}
div#hp ul li a span{
	width:100%;
	display:block;
	margin-bottom:15px;
	text-align:center;
	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	-ms-border-radius:10px;
	overflow:hidden;
}
div#hp ul li a span span.inner{
	display:block;
	width:100%;
	height:auto;
	margin:0;
	padding-top:100%;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	transition:all 0.3s linear;
}
div#hp ul li a span span.inner:hover{
	width:110%;
	margin:-5%;
	padding-top:110%;
}
div#hp ul li a h3{
	min-height:4em;
	margin-bottom:10px;
	padding:0;
	color:#35aaaf;
	font-size:16px;
	font-weight:bold;
	text-align:center;
	text-decoration:underline;
	transition:all 0.3 linear;
}
div#hp ul li a:hover h3{
	color:orange;
	text-decoration:none;
}
div#hp ul li a p{
	color:#3c3c3c;
	font-size:14px;
}
@media screen and (max-width: 510px){
	div#hp ul li{
		width:47.5%;
		margin:0 auto 30px;
		margin-right:5%;
	}
	div#hp ul li:nth-child(3n){
		margin-right:5%;
	}
	div#hp ul li:nth-child(2n){
		margin-right:0;
	}
	div#hp ul li a h3{
		font-size:14px;
		text-align:left;
		padding:0 0 0 15px;
		background:url(../images/arr.png) no-repeat left 0.4em;
	}
}
@media screen and (max-width: 350px){
	div#hp{
		padding:0;
	}
	div#hp ul li{
		width:100%;
		margin:0 auto 30px;
		margin-right:0;
		padding:0 0 30px;
		border-bottom:1px #ccc solid;
	}
	div#hp ul li:nth-child(3n){
		margin-right:0;
	}
	div#hp ul li:nth-child(2n){
		margin-right:0;
	}
	div#hp ul li:last-child{
		border-bottom:none;
	}
	div#hp ul li a h3{
		min-height:0;
	}
}	



/* bnr
------------------------------------------------*/
div#hp ul#bnr{
	margin:0 auto -20px;
	text-align:center;
}
div#hp ul#bnr li{
	width:185px;
	height:70px;
	margin:0 10px 20px;
	padding:0;
	border:1px #ccc solid;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-ms-border-radius:5px;
	overflow:hidden;
}
div#hp ul#bnr li:nth-child(4n){
	margin-right:10px;
}

div#hp ul#bnr li a img{
	max-width:100%;
}
div#hp ul#bnr li a:hover img{
    opacity:0.50!important;
    filter: alpha(opacity=50);
	transition: all 0.3s linear;
}

@media screen and (max-width: 693px){
}



/* accept cookie popup
------------------------------------------------*/
div#use_cookie{width:calc(100% - 60px);position:fixed;bottom:0;left:0;padding:15px 30px;background-color:rgba(235,235,225,0.9);transition:all 0.3s ease-in;z-index:999;}
div#use_cookie.agree{left:100%;}
div#use_cookie h3{margin-bottom:5px;font-size:18px;font-weight:bold;text-align:center;}
div#use_cookie p{width:calc(100% - 212px);float:left;margin-right:30px;font-size:14px;}
div#use_cookie a.btn{width:150px;min-width:0;float:right;margin-top:7px;background-color:#fff;}
div#use_cookie a.btn:hover{background-color:#ff6400;}
@media screen and (max-width:640px){
div#use_cookie p{width:100%;float:none;margin-right:0;margin-bottom:10px;}
div#use_cookie a.btn{width:180px;float:none;margin:0 auto;}
}