@charset "utf-8";

/* common
----------------------------------------------------------------------------------*/

body {
	margin: 0;
	padding: 0;
	font-size: 87.5%;
	font-family: Verdana,Arial,"メイリオ",Meiryo,"Osaka","ヒラギノ角ゴPro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック",sans-serif;
	line-height: 1.8;
	color: #646464;
	vertical-align: top;
	background: #ffffff;
	-webkit-text-size-adjust: 100%;
}

a:link   {color: #6c4f31;text-decoration: underline;}
a:visited{color: #6c4f31;text-decoration: underline;}
a:hover  {color: #ff6400;text-decoration: none;}
a:active {color: #6c4f31;text-decoration: underline;}

.link{
	position: relative;
	padding-left: 10px;
}
.link:before{
	position: absolute;
	left: 0;
	top: -1px;
	content: "\f0da";
	font-family: 'Font Awesome 5 Free';
    font-weight: 900;
}
.pdf-link:before{
	margin-right: 5px;
	content: "\f1c1";
	font-family: 'Font Awesome 5 Free';
    font-weight: 900;
}
.btn{
    display: inline-block;
    min-width: 300px;
    padding: 10px;
    text-align: center;
    border: 1px solid #6c4f31;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
}
.btn:hover{
    color: #fff;
    background: #6c4f31;
}
.btn .fa{
    margin-right: 5px;
}
.btn:hover .fa{
    color: #fff;
}
.hidden{
    display: none;
}
.list-style li{
    position: relative;
    margin: 0 0 10px;
    padding-left: 20px;
}
.list-style li:before{
    position: absolute;
	left: 0;
	top: 0;
	content: "\f0c8";
	font-family: 'Font Awesome 5 Free';
    font-weight: 900;
}

/* structure
----------------------------------------------------------------------------------*/
.inner{
	position: relative;
	width: 980px;
	margin: 0 auto;
}
@media only screen and (max-width: 1000px){
	.inner{
		width: auto;
		padding: 0 10px;
	}
}



/* header
----------------------------------------------------------------------------------*/
#header{
    position: relative;
    padding: 25px;
    background: url(../img/bg.gif) 0 0 repeat;
    overflow: hidden;
}
#header .h-logo{
    float: left;
}
#header .h-logo .tb_logo,
#header .h-logo .sp_logo{
    display: none;
}
#header .h-right{
    float: right;
    text-align: right;
}
#header #fontChange{
    display: inline-block;
    margin-right: 30px;
    vertical-align: middle;
}
#header #header-search{
    display: inline-block;
    vertical-align: middle;
}
#header .h-nav{
    margin: 15px 0 0;
    text-align: right;
}
#header .h-nav li{
    margin-left: 10px;
}
#header .h-nav li:first-child{
    margin-left: 0;
}
#header .h-nav li a{
    position: relative;
    display: inline-block;
	padding-left: 10px;
}
#header .h-nav li a:before{
	position: absolute;
	left: 0;
	top: 6px;
	content: "\f0da";
	font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    line-height: 1;
}
@media only screen and (max-width: 1000px){
    #header .h-logo .pc_logo{
        display: none;
    }
    #header .h-logo .tb_logo{
        display: block;
    }
}
@media only screen and (max-width: 768px){
    #header .h-logo{
        float: none;
    }
    #header{
        padding: 10px;
    }
    #header .h-right{
        float: none;
        text-align: center;
    }
    #header #fontChange,
    #header #header-search,
    #header .h-nav{
        display: none;
    }
    #header #header-search{
        width: 300px;
        margin: 0 auto;
        padding: 10px 0 0;
        text-align: center;
    }
    #header #header-search table{
        width: 100%;
    }
    #header #header-search table #searchBox{
        width: 100%;
    }
    #header #header-search table .pl5{
        width: 35px;
    }
    #header .btn-search,
	#header .btn-menu{
		position: absolute;
		top: 6px;
		line-height: 1;
	}
    #header .btn-search{
        right: 70px;
    }
    #header .btn-menu{
 		right: 10px;   
    }
}
@media only screen and (max-width: 540px){
    #header .h-logo .tb_logo{
        display: none;
    }
    #header .h-logo .sp_logo{
        display: block;
    }
}

/* fontChange
----------------------------------------------------------------------------------*/
#fontChange li{
	display:inline-block;
	*display:inline;
	height:26px;
	margin-left:2px;
	text-indent:-999999px;
	vertical-align:middle;
	line-height:1;
	cursor:pointer;
	zoom:1;
}
#fontChange li.title{
	display:inline-block;
	margin:0;
	text-indent:0;
	font-weight:bold;
	line-height:26px;
	cursor:default;
}
#fontChange li.title img{margin:7px 0 0;}
#fontChange li#fontS{width:18px;background:url(../img/fontsize.png) no-repeat left top;}
#fontChange li#fontM{width:22px;background:url(../img/fontsize.png) no-repeat -18px top;}
#fontChange li#fontL{width:26px;background:url(../img/fontsize.png) no-repeat right top;}

#fontChange li#fontS.change.active{background:url(../img/fontsize.png) no-repeat left bottom;}
#fontChange li#fontM.change.active{background:url(../img/fontsize.png) no-repeat -18px bottom;}
#fontChange li#fontL.change.active{background:url(../img/fontsize.png) no-repeat right bottom;}

#fontChange li#fontS:hover{background:url(../img/fontsize.png) no-repeat left bottom;}
#fontChange li#fontM:hover{background:url(../img/fontsize.png) no-repeat -18px bottom;}
#fontChange li#fontL:hover{background:url(../img/fontsize.png) no-repeat right bottom;}

/* フォントサイズ */
.fontS{font-size: 87.5%;}
.fontM{font-size: 100%;}
.fontL{font-size: 112.5%;}


/* globalnavi
----------------------------------------------------------------------------------*/
#gnavi ul{
    
}
#gnavi ul li{
    position: relative;
    text-align: center;
    border-left: 1px solid #c8c8c8;
}
#gnavi ul li.nav01{width: 10%;}
#gnavi ul li.nav02{width: 23%;}
#gnavi ul li.nav03{width: 12%;}
#gnavi ul li.nav04{width: 10%;}
#gnavi ul li.nav05{width: 17%;}
#gnavi ul li.nav06{width: 12%;}
#gnavi ul li.nav07{width: 16%;}
#gnavi ul li:first-child{
    border-left: none;
}
#gnavi ul li a{
    display: block;
    padding: 20px 10px;
    font-size: 20px;
    line-height: 1.6;
}
#gnavi ul li ul{
    display: none;
}
@media only screen and (min-width: 769px){
    #gnavi ul li ul{
        position: absolute;
        width: 360px;
        left: 50%;
        margin-left: -180px;
        border: 2px solid #009937;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -ms-border-radius: 5px;
        -o-border-radius: 5px;
        border-radius: 5px;
        background: #fff;
        z-index: 100;
    }
    #gnavi ul li ul li{
        display: block;
        width: auto;
        padding: 0 10px;
        border-left: none;
    }
    #gnavi ul li ul li a{
        padding: 15px 10px;
        font-size: 16px;
        border-bottom: 1px dotted #c8c8c8;
    }
    #gnavi ul li ul li:last-child a{
        border-bottom: none;
    }
}
@media only screen and (max-width: 1000px){
    #gnavi ul li a{
        padding: 20px 5px;
        font-size: 16px;
    }
    #gnavi ul li ul li a{
        font-size: 14px;
    }
}
@media only screen and (max-width: 768px){
	#gnavi{
		display: none;
	}
    #gnavi .inner{
        padding: 0;
    }
    #gnavi ul{
        display: block;
    }
	#gnavi ul li{
		display: block;
        width: auto!important;
		padding: 0;
        text-align: left;
        border-left: none;
	}
    #gnavi ul li:first-child{
        border-left: none;
    }
	#gnavi ul li a{
		color: #fff;
        font-size: 14px;
		text-decoration: none;
		background: #ff6464;
	}
	#gnavi ul li a,
	#gnavi ul li ul li a{
		position: relative;
		display: block;
		padding: 15px 10px;
		text-decoration: none;
		border-bottom: 1px solid #fff;
	}
	#gnavi ul li a:hover,
	#gnavi ul li ul li a:hover{
		text-decoration: none;
	}
	#gnavi ul li a:before {
		position: absolute;
		right: 10px;
		top: 16px;
		color: #fff;
		font-family: 'Font Awesome 5 Free';
        font-weight: 900;
		content:"\f054";
	}
	#gnavi ul li a[href="#"]:before {
		position: absolute;
		right: 10px;
		top: 16px;
		color: #fff;
		font-family: 'Font Awesome 5 Free';
        font-weight: 900;
		content:"\f078";
		-webkit-transition: 0.4s;
		-moz-transition: 0.4s;
		-ms-transition: 0.4s;
		-o-transition: 0.4s;
		transition: 0.4s;
	}
	#gnavi ul li a.active[href="#"]:before {
		-webkit-transform: scaleY(-1);
		-o-transform: scaleY(-1);
		-moz-transform: scaleY(-1);
		transform: scaleY(-1);
		filter: FlipV;
		-ms-filter: "FlipV"
	}
	#gnavi ul li ul{
		display: none;
		position: static;
		width: 100%;
	}
	#gnavi ul li ul li a{
		color: #ff6464;
		border-bottom: 1px solid #ff6464;
		background: #fff;
	}
	#gnavi ul li ul li a:hover{
		text-decoration: none;
		background: #fff;
	}
	#gnavi ul li ul li a:before{color: #ff6464;}
}


/* cttl
----------------------------------------------------------------------------------*/
#cttl{
    min-height: 200px;
    -webkit-background-size: cover!important;
    background-size: cover!important;
}
#cttl h1{
    padding: 55px 0 0;
    text-align: center;
}
#cttl.bg01{background: url(../img/cttl/bg01.jpg) center center no-repeat;}
#cttl.bg02{background: url(../img/cttl/bg02.jpg) center center no-repeat;}
#cttl.bg03{background: url(../img/cttl/bg03.jpg) center center no-repeat;}
#cttl.bg04{background: url(../img/cttl/bg04.jpg) center center no-repeat;}
#cttl.bg05{background: url(../img/cttl/bg05.jpg) center center no-repeat;}
@media only screen and (max-width: 768px){
    #cttl{
        min-height: inherit;
    }
    #cttl h1{
        padding: 15px 0;
    }
}


/* topicpath
----------------------------------------------------------------------------------*/
#topicpath{
	margin: 5px auto 25px;
}
#topicpath ul li:before{
    margin: 0 10px;
	content: "\f0da";
	font-family: 'Font Awesome 5 Free';
    font-weight: 900;
}
#topicpath ul li:first-child:before{
	content: "\f015";
}
@media only screen and (max-width: 640px){
	#topicpath{
		display: none;
	}
}


/* pttl
----------------------------------------------------------------------------------*/
#pttl{
    margin: 0 0 25px;
    padding: 20px 10px;
    background: url(../img/bg.gif) 0 0 repeat;
}
#pttl h2{
    color: #063;
    font-size: 28px;
    line-height: 1.5;
    text-align: center;
}
@media only screen and (max-width: 768px){
    #pttl h2{
        font-size: 20px;
    }
}

/* article
----------------------------------------------------------------------------------*/
#article{
    font-size: 114.285%;
    overflow: hidden;
}
#article .lead{
    font-size: 112.5%;
    text-align: center;
}
#article h1{
    margin: 80px 0 20px;
    padding: 0 50px 10px;
    color: #063;
    font-size: 22px;
    line-height: 1.5;
    text-align: center;
    border-bottom: 1px solid #c8c8c8;
    background: url(../img/icon-ja.png) right 90% no-repeat;
}
#article h2{
    margin: 40px 0 10px;
    padding: 2px 0 2px 5px;
    color: #063;
    font-size: 20px;
    line-height: 1.5;
    border-left: 5px solid #063;
    border-bottom: 1px solid #063;
}
#article h3{
    margin: 20px 0 10px;
    color: #063;
    font-size: 24px;
    line-height: 1.5;
}
#article h3 .note{
    margin-left: 10px;
    color: #646464;
    font-size: 12px;
}
#article ol,
#article ol li{
    list-style: decimal inside;
}
#article p{margin: 0;}
#article strong{
	font-weight: bold;
}
#article table{
	width: 100%;
     border-top: 1px solid #c8c8c8;
}
#article table th,
#article table td{
	padding: 5px 10px;
    border-bottom: 1px solid #c8c8c8;
}
#article table th{
    background: #f5f5f5;
}
@media only screen and (max-width: 768px){
    #article{
        font-size: 100%;
    }
    #article h1{
        margin: 60px 0 20px;
    }
    #article h3 .note{
        display: block;
        margin: 0 0 10px;
    }
    #article .table02{
        border-top: 1px solid #c8c8c8;
    }
    #article .table02 th{
        border-top: none;
    }
}


/* footer
----------------------------------------------------------------------------------*/
footer{
    position: relative;
    margin: 250px 0 0;
}
.pagetop{
	position: fixed;
	bottom: 10px;
	right: 30px;
    text-align: center;
}
.pagetop span{
    display: block;
    text-align: center;
}
#f-bnr{
    margin: 0 -10px 20px;
    overflow: hidden;
}
#f-bnr li{
    width: 20%;
    margin: 0 0 20px;
    padding: 0 10px;
}
@media only screen and (max-width: 768px){
    footer{
        margin: 100px 0 0;
    }
    .pagetop{
        display: none!important;
    }
    #f-bnr{
        margin: 0 -5px 10px;
        overflow: hidden;
    }
    #f-bnr li{
        width: 25%;
        margin: 0 0 10px;
        padding: 0 5px;
    }
}
@media only screen and (max-width: 480px){
    #f-bnr li{
        width: 50%;
        text-align: center;
    }
}
#footer{
	position: relative;
    padding-top: 35px;
    background: url(../img/bg.gif) 0 0 repeat;
}
#footer .f-logo{
    margin: 0 0 20px;
    text-align: center;
}
#footer address{
    display: block;
    text-align: center;
}
#sns-btn{
    margin: 30px 0;
    text-align: center;
}
#sns-btn span {
    display: inline-block;
    *display:inline;
    overflow: hidden;
    line-height: 1;
    vertical-align:top;
    zoom:1;
}
#sns-btn span img{
    max-width:100%;
    height:auto;
    vertical-align: text-top;
}
#sns-btn span#btn_facebook {
    width: calc(10em + 27px);
}
/*#sns-btn span#btn_google {
    width: 58px;
}*/
#sns-btn span#btn_twitter {
    width: 90px;
}
/*#sns-btn span#btn_line {
    width: 82px;
}*/
#sns-btn span#btn_line a{
    display: block;
    margin: -2px 0 0;
}
#footer .f-nav ul{
    text-align: center;
}
#footer .f-nav ul li{
    padding: 0 15px;
}
#footer .f-nav ul li a{
    position: relative;
    display: inline-block;
	padding-left: 10px;
}
#footer .f-nav ul li a:before{
	position: absolute;
	left: 0;
	top: 6px;
	font-family: 'Font Awesome 5 Free';
    font-weight: 900;
	content: "\f0da";
    line-height: 1;
}
#footer .copyright{
    margin: 20px 0 0;
    padding: 20px 10px;
    text-align: center;
    border-top: 1px solid #c8c8c8;
}
@media only screen and (max-width: 768px){
    #footer .f-nav{
        margin: 0 -5px;
    }
    #footer .f-nav ul{
        padding: 0 5px;
    }
}
@media only screen and (max-width: 480px){
    #footer .f-nav{
        margin: 0 -10px;
        border-top: 1px solid #c8c8c8;
    }
    #footer .f-nav ul{
        float: none;
        width: auto;
        padding: 0;
    }
    #footer .f-nav ul li{
        display: block;
        padding: 0;
        border-bottom: 1px solid #c8c8c8;
    }
    #footer .f-nav ul li a{
        position: relative;
        display: block;
        padding: 10px 10px 10px 20px;
        background: #fff;
    }
    #footer .f-nav ul li a:before{
        top: 15px;
        left: 7px;
    }
    #footer .copyright{
        margin: 0;
        border-top: none;
    }
}


/* topics
----------------------------------------------------------------------------------*/
.topics-list{
    margin: 0 0 20px;
}
.topics-list dt{
    float: left;
    width: 18em;
    padding: 10px 0 0;
}
.topics-list dd{
    padding: 10px 0 10px 19em;
    border-bottom: 1px dotted #c8c8c8;
}
.topics-list .cat{
    display: inline-block;
    width: 11em;
    margin-right: 15px;
    padding: 5px;
    color: #fff;
    line-height: 1;
    text-align: center;
    background: #006464;
}
body.home dl.topics-list dt{
    width: 20em;
}
body.home dl.topics-list dd{
	width:calc(100% - 20em)
    padding-left: 20em;
}
body.home dl.topics-list span.cat{
    width: 12em;
}
@media only screen and (max-width: 640px){
    .topics-list{
        padding: 30px 0;
    }
    .topics-list dt{
        float: none;
        padding: 0 0 5px;
    }
    body.home dl.topics-list dt{
        width: auto;
    }
    .topics-list dd{
        padding: 0 0 15px;
    }
}

/* home
----------------------------------------------------------------------------------*/
/* home-main */
#home-main{
    position: relative;
    margin: 0 0 40px;
}
#home-main ul li img{
    width: 100%;
    height: auto;
}
#home-main .btn_ichigospot,
#home-main .btn_loan{
	width:180px;
	position: absolute;
	bottom: -50px;
	right: 0;
	overflow:visible;
}
#home-main .btn_loan{
	width:141px;
	right: 195px;
}
#home-main .btn_ichigospot img,
#home-main .btn_loan img{
	filter: drop-shadow(3px 3px 3px rgba(0,0,0,0.3));
}
@media only screen and (max-width: 1054px){
	#home-main{
		margin-bottom:0;
		padding-bottom:10px;
		text-align:center;
		background: url(../img/bg.gif) 0 0 repeat;
	}
	#home-main ul.slick-slider{
		margin-bottom:10px;
	}
	#home-main .btn_ichigospot,
	#home-main .btn_loan{
		position: static;
		margin:0 10px
	}
	#home-main .btn_ichigospot img{width:180px;}
	#home-main .btn_loan img      {width:141px;}
}
@media only screen and (max-width: 860px){
	#home-main .btn_ichigospot img{width:20%;}
	#home-main .btn_loan img      {width:15%;}
}
@media only screen and (max-width: 540px){
	#home-main .btn_ichigospot,
	#home-main .btn_loan{
		margin:0 5px
	}
	#home-main .btn_ichigospot img{width:120px;}
	#home-main .btn_loan img      {width:90px;}
}
@media only screen and (max-width: 420px){
	#home-main .btn_ichigospot img{width:90px;}
	#home-main .btn_loan img      {width:75px;}
}

/* home-pickup */
#home-pickup{
    margin: 0 0 60px;
}
#home-pickup ul li a{
    display: block;
    background: #f0f0f0;
}
#home-pickup ul li a span{
    display: block;
    width: 100%;
    height: 200px;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: cover!important;
    background-size: cover!important;
}
#home-pickup ul li a figcaption{
    display: block;
    padding: 5px;
    text-align: center;
}
.slick-prev, .slick-next{
    width: 50px;
    height: 50px;
    z-index: 100;
}
.slick-next{
    right: 25px;
    background: url(../img/home/btn-next.png) 0 0 no-repeat;
}
.slick-prev{
    left: 25px;
    background: url(../img/home/btn-prev.png) 0 0 no-repeat;
}
.slick-next:hover{
    opacity: 0.5;
    background: url(../img/home/btn-next.png) 0 0 no-repeat;
}
.slick-prev:hover{
    opacity: 0.5;
    background: url(../img/home/btn-prev.png) 0 0 no-repeat;
}
.slick-prev:before, .slick-next:before{
    display: none;
}
.slick-dots{
    bottom: -45px;
}
.slick-dots li button:before{
    font-size: 20px;
    color: #c8c8c8;
    opacity: 1;
}
.slick-dots li.slick-active button:before{
    color: #6c4f31;
    opacity: 1;
}

/* home-nav */
#home-nav{
    padding: 10px 0;
    background: #f5ffdc;
}
#home-nav ul{
    margin: 0 -10px;
}
#home-nav ul li{
    position: relative;
    width: 25%;
    padding: 0 10px;
}
#home-nav ul li a{
    display: block;
    padding: 10px 5px;
    text-align: center;
    border: 1px solid #c8beb4;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
    background: #fff;
}
#home-nav ul li a:hover{
    color: #fff;
    background: #c8beb4;
}
#home-nav ul li a .fas{
    margin-right: 5px;
}

#home-nav ul li ul{
    display: none;
    position: absolute;
    width: 100%;
    padding: 21px 0 0;
    background: url(../img/home/bg-home-nav.png) center top no-repeat;
    z-index: 1000;
}
#home-nav ul li ul li{
    display: block;
    width: 100%;
    padding: 0 10px;
    border-left: 3px solid #ff6464;
    border-right: 3px solid #ff6464;
    background: #fff;
}
#home-nav ul li ul li:first-child{
    border-top: 3px solid #ff6464;
    -webkit-border-radius: 3px 3px 0px 0px;
    -moz-border-radius: 3px 3px 0px 0px;
    -ms-border-radius: 3px 3px 0px 0px;
    -o-border-radius: 3px 3px 0px 0px;
    border-radius: 3px 3px 0px 0px;
}
#home-nav ul li ul li:last-child{
    border-bottom: 3px solid #ff6464;
    -webkit-border-radius: 0px 0px 3px 3px;
    -moz-border-radius: 0px 0px 3px 3px;
    -ms-border-radius: 0px 0px 3px 3px;
    -o-border-radius: 0px 0px 3px 3px;
    border-radius: 0px 0px 3px 3px;
}
#home-nav ul li ul li a{
    border: none;
    border-bottom: 1px dotted #c8beb4;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
    background: none;
}
#home-nav ul li ul li:last-child a{
    border: none;
}
#home-nav ul li ul li a:hover{
    color: #ff6400;
    background: none;
}

@media only screen and (max-width: 640px){
    #home-nav ul{
        position: relative;
        margin: 0 -5px;
    }
    #home-nav ul li{
        position: static;
        width: 50%;
        margin: 0 0 10px;
        padding: 0 5px;
    }
    #home-nav ul li ul{
        top: 100px;
        width: calc(50% - 10px);
        margin: 0;
        z-index: 100;
    }
    #home-nav ul li:nth-child(1) ul,
    #home-nav ul li:nth-child(2) ul{
        top: calc(1.6em + 22px);
    }
    #home-nav ul li ul li{
        margin: 0;
    }
}


/* title */
.home-sec{
    margin: 0 0 40px;
}
.home-sec h1{
    height: 200px;
    margin: 0 0 30px;
    text-align: center;
    -webkit-background-size: cover!important;
    background-size: cover!important;
}
.home-sec h1 img{
    padding: 55px 0 0;
}
#home-product h1{background: url(../img/home/bg-product.jpg) no-repeat center center;}
#home-topics h1 {background: url(../img/home/bg-topics.jpg) no-repeat center center;}
#home-guide h1  {background: url(../img/home/bg-guide.jpg) no-repeat center center;}
#home-recipe h1{background: url(../img/home/bg-recipe.jpg) no-repeat center center;}

@media only screen and (max-width: 640px){
    .home-sec h1{
        height: inherit;
    }
    .home-sec h1 img{
        padding: 5px 0;
    }
}

/* topics */
.home-topics-tab{
    margin: 0 -10px 20px;
    overflow: hidden;
}
.home-topics-tab li{
    width: 20%;
    padding: 0 10px;
}
.home-topics-tab li a{
    display: block;
    padding: 10px;
    text-align: center;
    border: 1px solid #6c4f31;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
}
.home-topics-tab li a:hover{
    color: #fff;
    background: #6c4f31;
}
@media only screen and (max-width: 980px){
    .home-topics-tab{
        margin: 0 -5px 20px;
    }
    .home-topics-tab li{
        width: 20%;
        padding: 0 5px;
    }
}
@media only screen and (max-width: 768px){
    .home-topics-tab{
        margin-bottom: 0;
    }
    .home-topics-tab li{
        width: 33.333%;
        margin: 0 0 10px;
    }
}
@media only screen and (max-width: 480px){
    .home-topics-tab li{
        width: 50%;
    }
}

/* facebook */
.facebook{
    padding: 50px 10px;
    text-align: center;
    background: url(../img/bg.gif) 0 0 repeat;
}

/* guide */
#home-guide h2{
    margin: 0 0 30px;
    color: #063;
    font-size: 20px;
    line-height: 1.4;
    text-align: center;
}
#home-guide .guide-btn{
    margin: 30px -10px 0;
    overflow: hidden;
}
#home-guide .guide-btn li{
    width: 50%;
    margin: 0 0 20px;
    padding: 0 10px;
}
@media only screen and (max-width: 640px){
    #home-guide .guide-btn{
        margin: 30px -5px 0;
    }
    #home-guide .guide-btn li{
        margin: 0 0 10px;
        padding: 0 5px;
    }
}
@media only screen and (max-width: 480px){
    #home-guide .guide-btn li{
        width: 100%;
    }
}

/* home-recipe */
#home-recipe .recipe-list{
    margin: 0 0 40px;
}


/* movie
----------------------------------------------------------------------------------*/
#movie .youtube{
    text-align: center;
}
#movie .youtube iframe{
    width: 560px;
    height: 315px;
}
@media only screen and (max-width: 640px){
    #movie .youtube iframe{
        width: 300px;
        height: 168px;
    }
}

/* event
----------------------------------------------------------------------------------*/
.tribe-events-schedule,
.tribe-events-event-meta{
    display: none;
}
.tribe_events dl dt{
    float: left;
    width: 8em;
    padding: 10px 0 0;
    color: #063;
    font-weight: bold;
}
.tribe_events dl dd{
    padding: 10px 0 10px 9em;
}
@media only screen and (max-width: 640px){
    #tribe-events-bar{display: none;}
}

/* pagenavi
----------------------------------------------------------------------------------*/
.wp-pagenavi {
    margin: 30px 0;
	text-align: center;
}
.wp-pagenavi a:link,.wp-pagenavi a:visited, .wp-pagenavi span {
    border: 1px solid #ccc;
    margin: 2px;
    padding: 6px 15px;
	color: #ccc!important;
	font-size: 24px;
    text-decoration: none!important;
	vertical-align: middle;
	border-radius: 12px;
}
.wp-pagenavi a:hover, .wp-pagenavi span.current {
	color: #fff!important;
    border-color: #ff6400;
	background: #ff6400;
}
.single-pagenavi{
    margin: 100px 0 0;
    padding: 30px 0 0;
    border-top: 1px solid #c8c8c8;
}
.single-pagenavi li{
    margin-left: 10px;
}
.single-pagenavi li:first-child{
    margin-left: 0;
}
.single-pagenavi li .btn{
    min-width: 130px;
}
@media only screen and (max-width: 999px) {
	.wp-pagenavi {
		margin: 20px 0;
	}
    .single-pagenavi{
        text-align: center;
    }
}

/* store
----------------------------------------------------------------------------------*/
.hagano{overflow: hidden;}
.tooltip {  
    width: 250px;
    position: absolute;
    left: -9999px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
    background: #fff;
    -webkit-box-shadow: 0 10px 10px -5px rgba(0,0,0,0.5);
    box-shadow: 0 10px 10px -5px rgba(0,0,0,0.5);
    z-index: 10000;
}  
.tooltip:after{
  content: "";
  position: absolute;
  right: 0;
  bottom: -20px;
  left: 0;
  width: 0px;
  height: 0px;
  margin: auto;
  border-style: solid;
  border-color: #ffffff transparent transparent transparent;
  border-width: 20px 15px 0 15px;
}

.tooltip p{
    padding: 10px;
    font-weight: bold;
    text-align: center;
} 
.hagano #gmap{
    height: 500px;
    margin: 0 0 30px;
}
.hagano .store_photo{
    float: left;
    margin: 0 20px 0 0!important;
    text-align: center;
}
.hagano #store_detail_table{
    float: right;
    width: calc(100% - 260px);
}
.hagano .sagi{
    padding: 20px;
    border: 3px solid #ff0000;
}
.hagano .sagi h1{
    margin-top: 0!important;
    color: #f00!important;
}

@media only screen and (max-width: 640px){
    .hagano #gmap{
        height: 300px;
    }
    .hagano .store_photo{
        float: none;
        margin: 0 0 20px!important;
    }
    .hagano #store_detail_table{
        float: none;
        width: 100%;
    }
}

/* store-map
----------------------------------------------------------------------------------*/
#store-map{
    position: relative;
}
#store-map .sp-img{display: none;}
#store-map .pin li{
    position: absolute;
}
#store-map .pin li.pin01{left: 397px;bottom: 385px;}
#store-map .pin li.pin02{left: 314px;bottom: 363px;}
#store-map .pin li.pin03{left: 180px;bottom: 130px;}
#store-map .pin li.pin04{left: 514px;bottom: 422px;}
#store-map .pin li.pin05{right: 179px;top: 286px;}
#store-map .pin li.pin06{right: 422px;top: 222px;}
#store-map .pin li.pin07{left: 427px;top: 252px;}
#store-map .pin li.pin08{left: 320px;bottom: 280px;}
#store-map .pin li.pin09{left: 318px;bottom: 442px;}
#store-map .pin li.pin10{left: 279px;bottom: 192px;}
#store-map .pin li.pin11{left: 97px;bottom: 91px;}
#store-map .pin li.pin12{left: 299px;bottom: 465px;}
#store-map .pin li.pin13{left: 459px;bottom: 382px;}
#store-map .pin li.pin14{left: 447px;top: 227px;}
#store-map .pin li.pin15{right: 438px;top: 251px;}
#store-map .pin li.pin16{left: 457px;top: 261px;}
#store-map .pin li.pin17{left: 393px;bottom: 287px;}
#store-map .pin li.pin18{left: 350px;bottom: 295px;}
#store-map .pin li.pin19{right: 395px;top: 240px;}
#store-map .pin li.pin20{left: 470px;top: 120px;}
#store-map .pin li.pin21{right: 134px;top: 176px;}

#store-map .pin li .list{
    display: none;
    position: relative;
    padding: 0 0 0;
	z-index: 1000;
}
#store-map .pin li .list-inner{
    position: relative;
}
#store-map .pin li .list-inner:after, #store-map .pin li .list-inner:before {
	bottom: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

#store-map .pin li .list-inner:after {
	border-color: rgba(255, 255, 255, 0);
	border-top-color: #fff;
	border-width: 15px;
	margin-left: -15px;
}
#store-map .pin li .list-inner:before {
	border-color: rgba(255, 255, 255, 0);
	border-top-color: #fff;
	border-width: 16px;
	margin-left: -16px;
}
#store-map .pin li ul{
    position: absolute;
    left: 50%;
    bottom: 30px;
    width: 250px;
    margin-left: -110px;
    padding: 10px 15px;
    border: 1px solid #fff;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
    background: #fff;
    -webkit-box-shadow: 5px 5px 5px rgba(0,0,0,0.3);
    box-shadow: 5px 5px 5px rgba(0,0,0,0.3);
}
#store-map .pin li ul li{
    position: static;
    margin: 5px 0;
}
#store-map .pin li ul li a{
    position: relative;
    padding-left: 10px;
    font-size: 14px;
}
#store-map .pin li ul li a:before{
    position: absolute;
    left: 0;
    top: 2px;
    content: "\f0da";
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    line-height: 1;
}
@media only screen and (max-width: 980px){
    #store-map .pc-img{display: none;}
    #store-map .sp-img{display: block;}
    #store-map .pin{display: none !important;}
}

/* about
----------------------------------------------------------------------------------*/
div.hagano h1{
	clear:both;
}
ul#board_member{}
ul#board_member li span{
	width:8em;
	display:inline-block;
}
@media screen and (max-width:450px){
	ul#board_member li{
		padding-left:1em;
	}
	ul#board_member li span:before{
		content:"○";
		font-size:22px;
	}
	ul#board_member li span{
		display:block;
		text-indent:-1em;
	}
	table#history,
	table#history tr{
		width:100%!important;
		height:auto!important;
	}
	table#history th,
	table#history td{
		width:100%!important;
		height:auto!important;
		display:block;
	}
	table#history td.date{
		width: 154px;
		padding-bottom:0;
		border-bottom:none;
	}
	table#history td.taC{
		color:#063;
		font-weight:bold;
		background-color:#f5f5f5;
	}
}

/* business
----------------------------------------------------------------------------------*/
.business-list li{
    margin: 50px 0 0;
}
.business-list li a{
    display: block;
    min-height: 120px;
    padding-left: 140px;
    color: #646464;
    text-decoration: none;
}
.business-list li.list01 a{background: url(../img/business/icon01.gif) 0 0 no-repeat;}
.business-list li.list02 a{background: url(../img/business/icon02.gif) 0 0 no-repeat;}
.business-list li.list03 a{background: url(../img/business/icon03.gif) 0 0 no-repeat;}
.business-list li.list04 a{background: url(../img/business/icon04.gif) 0 0 no-repeat;}
.business-list li.list05 a{background: url(../img/business/icon05.gif) 0 0 no-repeat;}
.business-list li.list06 a{background: url(../img/business/icon06.gif) 0 0 no-repeat;}
.business-list li a span{
    display: block;
}
.business-list li a span.title{
    margin: 0 0 10px;
    color: #6c4f31;
    font-size: 24px;
    text-decoration: underline;
}
.business-list li a:hover span.title{
    color: #ff6400;
    text-decoration: none;
}


/* loan
----------------------------------------------------------------------------------*/
.loan-list li{
    margin: 50px 0 0;
}
.loan-list li a{
    display: block;
    min-height: 120px;
    padding-left: 140px;
    color: #646464;
    text-decoration: none;
}
.loan-list li.list01 a{background: url(../img/loan/icon01.gif) 0 0 no-repeat;}
.loan-list li.list02 a{background: url(../img/loan/icon02.gif) 0 0 no-repeat;}
.loan-list li.list03 a{background: url(../img/loan/icon03.gif) 0 0 no-repeat;}
.loan-list li.list04 a{background: url(../img/loan/icon04.gif) 0 0 no-repeat;}
.loan-list li.list05 a{background: url(../img/loan/icon05.gif) 0 0 no-repeat;}
.loan-list li.list06 a{background: url(../img/loan/icon06.gif) 0 0 no-repeat;}
.loan-list li.list07 a{background: url(../img/loan/icon07.gif) 0 0 no-repeat;}
.loan-list li.list08 a{background: url(../img/loan/icon08.gif) 0 0 no-repeat;}
.loan-list li a span{
    display: block;
}
.loan-list li a span.title{
    margin: 0 0 10px;
    color: #6c4f31;
    font-size: 24px;
    text-decoration: underline;
}
.loan-list li a:hover span.title{
    color: #ff6400;
    text-decoration: none;
}
.policy-box{
    height: 300px;
    margin: 20px 0 0;
    padding: 20px;
    font-size: 12px;
    border: 1px solid #c8c8c8;
    overflow: auto;
}
#form_entry{
    text-align: center;
}
#btn_back,
#btn_submit {
    width: 177px;
    height: 77px;
    border: none;
    text-indent: 9998px;
    cursor: pointer;
}
#btn_back{
    margin-right: 30px;
    background: url(../img/loan/btn_disagree.gif) no-repeat;
}
#btn_submit {
    background: url(../img/loan/btn_agree.gif) no-repeat;
}
#btn_back:hover,
#btn_submit:hover {
    opacity: 0.5;
}
@media only screen and (max-width: 640px){
    #btn_back,
    #btn_submit {
        display: block;
        margin: 0 auto;
    }
    #btn_back{
        margin: 0 auto 30px;
    }
}

/* faq
----------------------------------------------------------------------------------*/
.faq-list li{
    border-bottom: 1px dotted #c8c8c8;
}
.faq-list li dl dt{
    padding: 10px 10px 10px 50px;
    color: #6c4f31;
    text-decoration: underline;
    background: url(../img/q.png) 0 8px no-repeat;
    cursor: pointer;
}
.faq-list li dl dt:hover{
    color: #ff6400;
    text-decoration: none;
}
.faq-list li dl dd{
    display: none;
    padding: 10px 10px 10px 50px;
    background: url(../img/a.png) 0 8px no-repeat;
}
.faq .pdf{
    margin: 60px 0 0;
    text-align: center;
}
.faq .pdf img{
    margin: 0 0 10px;
}


/* recipe
----------------------------------------------------------------------------------*/
.recipe-list{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    -webkit-display: flex;
    -moz-display: flex;
    -ms-display: flex;
    -o-display: flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    -o-justify-content: center;
    justify-content: center;
    margin: 0 -13px;
    overflow: hidden;
}
.recipe-list li{
    margin: 0 0 20px;
    padding: 0 13px;
    -ms-align-self: center;
    align-self: center;
}
.recipe-list li a{
    display: table;
    width: 225px;
    height: 225px;
    color: #fff;
    text-decoration: none;
    vertical-align: middle;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: cover!important;
    background-size: cover!important;
}
.recipe-list li a span{
    display: table-cell;
    width: 225px;
    height: 225px;
    text-align: center;
    vertical-align: middle;
    opacity: 0;
    -webkit-transition: 0.8s;
	-moz-transition: 0.8s;
	-ms-transition: 0.8s;
	-o-transition: 0.8s;
	transition: 0.8s;
    background: rgba(0,0,0,0.4);
}
.recipe-list li a:hover span{
    opacity: 1; 
}
#recipe .recipe-img{
    float: right;
    max-width: 450px;
    margin-left: 30px;
}
@media only screen and (max-width: 768px){
    #recipe .recipe-img{
        float: none;
        max-width: inherit;
        margin: 0 0 30px;
        text-align: center;
    }
}

/* product
----------------------------------------------------------------------------------*/
.product-list{
    overflow: hidden;
}
.product-list .left{
    float: left;
    width: 64.285%;
}
.product-list .right{
    float: right;
    width: 30.612%;
}
.product-list .list{
    margin: 30px 0 0;
	position:relative;
}
.product-list .list02{
    float: left;
    width: 47.619%;
}
.product-list .list03{
    float: right;
    width: 47.619%;
}
.product-list .list a{
    position: relative;
    display: block;
}
.product-list .list figcaption{
    position: absolute;
    width: 100%;
    bottom: 0;
    padding: 5px 0 0;
    font-size: 20px;
    font-weight: bold;
    line-height: 1;
    background: rgba(255,255,255,0.85);
	z-index:999;
}
.product-list .list figcaption span{
    display: inline-block;
    margin: -5px 10px 0 0;
    font-size: 40px;
    font-weight: bold;
    vertical-align: middle;
}
.product-list .list01 figcaption span{color: #ff2896;font-size: 54px;}
.product-list .list02 figcaption span{color: #3e00b9;}
.product-list .list03 figcaption span{color: #ff8f17;}
.product-list .list04 figcaption span{color: #00966c;}
.product-list .list05 figcaption span{color: #ff0000;}
.product-list .list06 figcaption span{color: #96c832;}
.product-list .list p{
    margin: 10px 0 0;
}
@media only screen and (max-width: 640px){
    .product-list .left,
    .product-list .right{
        float: none;
        width: auto;
    }
    .product-list .list04,
    .product-list .list06{
        float: left;
        width: 47.619%;
    }
    .product-list .list05{
        float: right;
        width: 47.619%;
    }
}

/* ichigo */
#article .cautionBox {
    padding: 10px;
    border: 5px solid #ffe2e2;
    margin: 0 0 20px;
}


/* ichigospot
----------------------------------------------------------------------------------*/
#ichigospot .icon-note{
    margin: 20px 0;
    text-align: center;
}
#ichigospot .icon-note li{
    padding: 0 20px;
    font-size: 12px;
}
#ichigospot .icon-note li img{
    width: 20px;
    margin-right: 5px;
    vertical-align: text-bottom;
}
#ichigospot .spot-list{
    margin: 0 -20px;
    overflow: hidden;
}
#ichigospot .spot-list li{
    width: 33.333%;
    margin: 0 0 20px;
    padding: 0 20px;
}
#ichigospot .spot-list li figure{
    position: relative;
}
#ichigospot .spot-list li figure ul{
    position: absolute;
    top: 150px;
    right: 10px;
    margin: 0 -5px;
}
#ichigospot .spot-list li figure ul li{
    width: auto;
    margin: 0;
    padding: 0 5px;
}
#ichigospot .spot-list li span{
    display: block;
}
#ichigospot .spot-list li .ttl{
    padding: 20px 0 20px 40px;
    line-height: 1.4;
    background: url(../img/ichigospot/icon-ichigo.png) 5px center no-repeat;
}
#ichigospot .spot-left{
    float: left;
    width: 48%;
}
#ichigospot .spot-right{
    float: right;
    width: 48%;
}
#ichigospot .service-area li{
    padding: 10px 0 10px 40px;
    border-bottom: 1px dotted #c8c8c8;
    background: url(../img/ichigospot/icon-ichigo.png) 5px center no-repeat;
    overflow: hidden;
}
#ichigospot .service-area li span{
    float: left;
    display: block;
    padding: 8px 0 0;
}
#ichigospot .service-area li ul{
    float: right;
}
#ichigospot .service-area li ul li{
    padding: 0 10px;
    border: none;
    background: none;
}
#ichigospot #hagano-spot{
    min-height: 580px;
    margin: 40px 0 0;
    padding: 40px 0 0;
    background: url(../img/ichigospot/map-all.png) right top no-repeat;
}
#ichigospot #hagano-spot h1{
    margin-top: 0;
}
#ichigospot .map-moka   {background: url(../img/ichigospot/map-moka.png) right top no-repeat!important;}
#ichigospot .map-mashiko{background: url(../img/ichigospot/map-mashiko.png) right top no-repeat!important;}
#ichigospot .map-motegi {background: url(../img/ichigospot/map-motegi.png) right top no-repeat!important;}
#ichigospot .map-ichikai{background: url(../img/ichigospot/map-ichikai.png) right top no-repeat!important;}
#ichigospot .map-haga   {background: url(../img/ichigospot/map-haga.png) right top no-repeat!important;}

@media only screen and (max-width: 980px){
    #ichigospot .spot-list{
        margin: 0 -10px;
        overflow: hidden;
    }
    #ichigospot .spot-list li{
        padding: 0 10px;
    }
}
@media only screen and (max-width: 768px){
    #ichigospot .spot-left{
        float: none;
        width: auto;
    }
    #ichigospot .spot-right{
        float: none;
        width: auto;
    }
}
@media only screen and (max-width: 640px){
    #ichigospot .icon-note li{
        padding: 5px 20px;
    }
    #ichigospot .spot-list{
        margin: 0 -5px;
        overflow: hidden;
    }
    #ichigospot .spot-list li{
        width: 50%;
        padding: 0 5px;
    }
    #ichigospot #hagano-spot{
        background: none!important;
    }
}

/* info
----------------------------------------------------------------------------------*/
.pdf-list li{
    padding: 15px 0;
    border-bottom: 1px dotted #c8c8c8;
}


/* inquiry
----------------------------------------------------------------------------------*/
.error{
	margin: 20px 0 0;
	padding: 10px;
	border: 2px solid #FF0000;
	font-size: 16px;
	font-weight: bold;
	color: #FF0000;
	background: #fefede;
}
.form-list textarea,
.form-list input[type="text"],
.form-list input[type="email"],
.form-list input[type="tel"]{
	width:100%;
	padding: 10px;
	border: 2px solid #e1e1e1;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
}
#order select{
	padding: 10px;
	border: 2px solid #e1e1e1;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
}
.form-list dt{
    float: left;
    width: 25em;
    padding: 20px 0 0;
}
.form-list dt .required{
    margin-right: 7px; 
    padding: 5px 10px;
    color: #fff;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
	background: #c84646; 
}
.form-list .note{
	display: block;
	font-size: 12px;
}
.form-list dd{
	padding: 20px 0 20px 27em;
	border-bottom: 1px solid #c8c8c8;
}
.form-list dd:after{
	content: ".";  
	display: block;  
	visibility: hidden;  
	height: 0.1px;  
	font-size: 0.1em;  
	line-height: 0;  
	clear: both;
}
.form-list dd input[name="your-zip"]{margin-right:10px;}

.form-list dd .col2 li{margin: 0 0 10px;}
input.ws{width: 15%!important;}
input.wm{width: 30%!important;}
.wpcf7-recaptcha{
    margin: 40px 0 0;
}
.wpcf7-recaptcha div{
    margin: 0 auto;
}
.submit{
    margin: 40px 0 0;
    text-align: center;
}
.submit input{
	display:block;
	margin:0 auto;
    background: none;
    cursor: pointer;
}
.submit input:hover{
    background: #6c4f31;
}
div.wpcf7-response-output{
    padding: 30px 20px!important;
    color: #f00;
    font-weight: bold;
	text-align:center;
    border: 3px solid #ff0000!important;
}
div.wpcf7-mail-sent-ok{
    color: #398f14;
    border: 3px solid #398f14!important;
}
span.wpcf7-list-item.first{margin: 0;}
@media only screen and (max-width: 640px){
	.form-list dt{
		float: none;
		width: auto;
	}
	.form-list dd{
		padding: 0 0 20px;
	}	
}

/* note_mail */
p.note_mail{
	padding:5px 10px 20px;
}
#home-main p.note_mail{
	padding-bottom:15px;
	background-color:#f5ffdc;
}
p.note_mail a{
	max-width:36em;
	display:block;
	margin:0 auto;
	padding:10px 15px;
	color:#fff;
	font-size:20px;
	font-weight:bold;
	text-align:center;
	background-color:red;
	border-radius:10px;
	transition:all 0.3s linear;
}
#
p.note_mail a:hover{
	background-color:orange;
}
@media screen and (max-width:768px){
	p.note_mail{
		padding-top:0;
	}
	p.note_mail a{
		font-size:18px;
	}
}
@media screen and (max-width:640px){
	p.note_mail{
		margin-top:-5px;
	}
	p.note_mail a{
		font-size:16px;
	}
}

/* loan_review_bnr */
div#loan_review_bnr{
	width:150px;
	height:150px;
	position: fixed;
	display: block;
	top: calc(50vh - 75px);
	right:25px;
	transition:all 0.3s linear;
}
div#loan_review_bnr img{
	max-width:100%;
}
div#loan_review_bnr:hover img{
	opacity:0.5;
}
@media screen and (max-width:770px){
	div#loan_review_bnr{
		width:120px;
		height:120px;
		top: auto;
		bottom:0;
		right:90px;
	}
}
@media screen and (max-width:540px){
	div#loan_review_bnr{
		width:100px;
		height:100px;
		right:calc(50vw - 50px);
	}
}