@charset "utf-8";



body {
  font-family:"游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro",メイリオ,Meiryo,sans-serif;
}


html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,
del,dfn,em,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,
b,u,i,center,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,embed,
figure,figcaption,footer,header,hgroup,
menu,nav,output,ruby,section,summary,
time,mark,audio,video{
	margin:0;
	padding:0;
	font-family: 'Noto Serif Japanese', serif, sans-serif;
	letter-spacing: 0.1em;
	font-weight: normal;
}


*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}




input,
textarea{
	font-weight:normal;
	font-size:100%;
}
ol,ul{
	list-style:none;
}
blockquote,q{
	quotes:none;
}
blockquote:before,blockquote:after,
q:before,q:after{
	content:'';
	content:none;
}
input,
textarea,
select{
	 font-family: 'Noto Serif Japanese', serif, sans-serif;
}
a{
	overflow:hidden;
	outline:none;
	text-decoration:none;
	color:#333;
}
a:hover,
a:active{
	text-decoration:underline;
	opacity:0.8;
}
input[type="text"]:focus{
	outline:0;
}
table{
	border-collapse:collapse;
	border-spacing:0;
}

img{
	max-width: 100%;
	border:none;
	-ms-interpolation-mode:bicubic;
	vertical-align:bottom;
}
a img{
	border:none;
}
a:hover img{
	opacity:0.7;
	filter:alpha(opacity=70);		/* ie7 */
	-ms-filter:"alpha(opacity=70)";	/* ie8 */
}






/* --------------------------------------------------------------------------------
	タグ
-------------------------------------------------------------------------------- */

html,body {
    height: 100%;
	margin:0;
	
}

/* --------------------------------------------------------------------------------
	タグ
-------------------------------------------------------------------------------- */
body{
	line-height:1.5;
	font-size:80%;
	-webkit-text-size-adjust:100%;
}


/* --------------------------------------------------------------------------------
	共通クラス
-------------------------------------------------------------------------------- */
.clear{
	clear:both;
}

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


.device-pc{
	display:none;
}

.device-sp{
	display:block;
}


.h-search.fix{
	

	position: fixed;
	top: 0;
	width: 100%;
	z-index: 9999;
}



.fix-pd{
	padding-top: 135px!important;
	
}


.home .fix-pd{
	padding-top: 75px!important;
	
}




/* --------------------------------------------------------------------------------
	container
-------------------------------------------------------------------------------- */
#container{
}


/* --------------------------------------------------------------------------------
	header
-------------------------------------------------------------------------------- */
#header a{
	color:#1b224c;
	text-decoration:none;
}


#header{
	/*position:absolute;*/
	color:#fff;
	/*z-index:9999;*/
	width:100%;
	height: 70px;
	background:#fff !important

}


.header-inner{
	padding:15px 0;
	position: relative;
	display: flex;
	justify-content: flex-end;
	}


.header-inner h1{
	position: absolute;
    width: 3.5em;
	left: 0;
	right: 0;
	margin: 0 auto;

	}


.header-inner h1 img{
    
	}





/********** メニュー **********/



nav {
    display: none;
    /*background-color: rgba(27,34,76,1.00);*/
	background: #fff;
    left: 0;
    position: fixed;
    overflow-y: scroll;
    z-index: 9998;
    top: 0;
    width: 100%;
    height: 100%;
    -webkit-overflow-scrolling: touch;
}


	/*開閉ボタン*/
	#nav_toggle{
		display: block;
		width: 40px;
		height: 20px;
		position: relative;
		top: 12px;
		z-index: 9999;
		right: 15px;
		
	}
	
	#nav_toggle div {
		position: relative;
	}
	#nav_toggle span{
		display: block;
		height: 1px;
		background: #1b224c;
		position: absolute;
		width: 100%;
		left: 0;
		-webkit-transition: 0.5s ease-in-out;
		-moz-transition: 0.5s ease-in-out;
		transition: 0.5s ease-in-out;
	}
	
	#nav_toggle span:nth-child(1){
		top:0px;
	}
	#nav_toggle span:nth-child(2){
		top:9px;
	}
	#nav_toggle span:nth-child(3){
		top:18px;
	}
	
	/*開閉ボタンopen時*/
	.open #nav_toggle span:nth-child(1) {
		
			top: 12px;
		   -webkit-transform: rotate(135deg);
			-moz-transform: rotate(135deg);
			transform: rotate(135deg);
		}
		.open #nav_toggle span:nth-child(2) {
			width: 0;
			left: 50%;
		}
		.open #nav_toggle span:nth-child(3) {
			top: 12px;
			-webkit-transform: rotate(-135deg);
			-moz-transform: rotate(-135deg);
			transform: rotate(-135deg);
		}






span.menu-txt{
	display: none;
	font-size: 20px;
	color: #fff;
	padding: 5px 110px;
	
}




.drawer-nav .drawer-menu{
	padding: 120px 0 0 ;
	
}


.drawer-nav  .menu-inner{
	padding: 0 2em;
	text-align: center;
	
}


.drawer-nav .menu-logo{
	margin: 0 0 60px;
	
	
}


.drawer-nav .menu-logo ul {
	padding: 30px 0 0;
	display: flex;
	align-items: center;
	justify-content:center ;
	
	
}

.drawer-nav .menu-logo ul li {
	padding: 0 15px;
}


.drawer-nav .contents-list h2 {
	font-size: 24px;
	font-weight: bold;
	color: #1b224c;
	margin: 0 0 40px;
}


.drawer-nav .contents-list .menu-list{
	margin: 0 0 80px;
}


.drawer-nav .contents-list .menu-list li {
	font-size: 14px;
	font-weight: bold;
	margin: 0 0 40px;
	
}

.drawer-nav .contents-list li:last-child {
	margin: 0;
	
}


.drawer-nav .contents-list .other-list {
	margin: 0 0 35px;
	
}


.drawer-nav .contents-list .other-list li {
	font-size: 20px;
	font-weight: bold;
	margin: 0 0 20px;
	
}


	
.drawer-nav .shop-info{
	width: 90%;
	margin: 30px auto;
	padding: 30px 30px;
    text-align: center;
	background: #1b224c;
}

.drawer-nav .shop-info .logo{
	font-size: 14px;
	padding: 0 0 15px;
}

.drawer-nav .shop-info p{
	font-size: 12px;
	padding: 0 0 20px;
}

.drawer-nav .shop-info a{
	color: #fff!important;
	
}

.drawer-nav .shop-info .copy{
	font-size: 12px;
	
}


.drawer-nav .h-info{
	width: 90%;
	margin: 0 auto;
	background: #f3f3f6;
	padding: 30px 0;
	
}

.h-info {
	background: #f3f3f6;
	
}

.h-info ul {
	display: flex;
	justify-content: center;
}

.h-info ul li{
	padding: 0 10px;
	
}


.h-info a {
    background: #00acba;
    display: block;
    padding: 14px;
    font-size: 12px;
    font-weight: bold;
    color: #fff !important;
    text-align: center;
    border-radius: 4px;
}


/*サーチ*/


.h-search {
    background: #1b224c;
    padding: 10px 0;
}

.h-search form ul {
    display: flex;
    justify-content: center;
    align-items: center;
}

.h-search form ul li{
    display: flex;
    justify-content: center;
    align-items: center;
}

.h-search form ul li h4{
	color: #fff;
	padding:0 10px;
	font-size: 14px;   
}


.h-search form ul li label{
	background: #eee;
	border-radius: 10px 0 0 10px;
	
  
}


.h-search form ul li select{
	height: 35px;
	min-width: auto !important;
	font-size: 14px;
  
}

.h-search form select option {
    font-size: 14px;
    padding: 5px;
}

.h-search form ul .sf-field-search input{
	width: 35vw;
	padding: 5px;
	height: 35px;
  
}

.h-search form ul .sf-field-submit input[type="submit"] {
	width: 50px!important;
	padding: 5px;
	height: 35px;
	background: url(https://funtool.jp/wp-content/uploads/2020/05/34466ec6b9ddb694474e243790eb7b12-1024x683.jpg)
  
}












/* --------------------------------------------------------------------------------
	wrapper
-------------------------------------------------------------------------------- */
#wrapper{
}


#main-visual{
	display: none;
	position: relative;
	
	
	
}



#main-visual p {
	width: 80%;
	position: absolute;
	bottom: 50px;
	z-index: 99;
	right: 0;
	left: 0;
	margin: 0 auto;
	background: #00acba;

}



#main-visual p a{
    display: block;
    padding: 10px;
    font-size: 12px;
    font-weight: bold;
    color: #fff;
    text-align: center;
    border-radius: 4px;
}





#main-visual .swiper-container-top{
	height: 350px;
	width: 100%;
	overflow-x: hidden;
}

#main-visual .swiper-container-top img{
	height: 350px;
	width: 100%;
	object-fit: cover;
	display: block;
	
}



@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

#main-visual .swiper-container-top img{

  animation: fadeIn 4s ease 0s 1 normal;
}

 


#main-visual .main-catch{
	position: absolute;
	top:0;
	z-index: 99;
	width: 100%;
	/*height: 100%;*/
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;

}


#main-visual .main-catch h2{
	color: #fff;
	font-size: 45px;
	margin: 0 0 20px;
}


#main-visual .main-catch a{
	background: #00acba;
    color: #fff;
    font-size: 14px;
    display: inline-block;
    padding: 15px 70px;
    border-radius: 25px;
    margin: 0 0 15px;
}


#main-visual .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
    bottom: 90px;
    left: 0;
    width: 100%;
}


/* --------------------------------------------------------------------------------
	sub1
-------------------------------------------------------------------------------- */


#sub1{
	
	}

#sub1 .logo{
	text-align: center;
	border: 1px solid #eee;
	margin: 0 0 50px;
	}

#sub1 .logo img{
	width:278px;
	}


#sub1 h3{
	color: #1b224c;
	font-weight: bold;
	margin: 0 0 20px;
	}


#sub1 .pickup-list{
	margin: 0 0 20px;
	
}


#sub1 .pickup-list a{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

#sub1 .pickup-list .img{
	width: 40%;
	position: relative;
	
}

#sub1 .pickup-list .img img{
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 0 0 20px;
	
	
}

#sub1 .pickup-list .img p{
	font-size: 12px;
	color: #fff;
	text-align: center;
	padding: 5px;
	background: #1b224c;
	position: absolute;
	bottom: 0;
	width: 100%;
}

#sub1 .pickup-list .img span::before{
	content: '・';
	display: inline-block;
	padding: 0px;	
}

#sub1 .pickup-list .img span:first-child::before{
	content: '';
	
}


#sub1 .pickup-list .txt{
	width: 50%;
	font-size: 12px;
}




#sub1 .category-list ul li::before{
    content: '●';
	display: inline-block;
    font-size: 14px;
    
}

#sub1 ul li {
    margin: 0 0 15px;
    font-size: 14px;
    
}


#sub1 .search-item-sub1 ul li {
    margin: 0;
    
}

#sub1 .search-item-sub1 input{
	width: 100%;
	padding: 5px;
    height: 35px;
	border: 1px solid #ccc;
}

#sub1 .searchandfilter label {
    display: block; 
    margin: 0;
    padding: 0;
}



#sub1 .search-item-sub1 select{
	width: 100%;
	height: 35px;
    min-width: auto !important;
    font-size: 14px;
	border: 1px solid #ccc;
}















/* --------------------------------------------------------------------------------
	footer
-------------------------------------------------------------------------------- */


#footer {
	
}


#footer .brand-list{
	background: #f3f3f6;
	padding: 60px 1em;
}

#footer .brand-list ul{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	
}


#footer .brand-list ul li{
	width: 48%;
	border: 1px solid #ccc;
	margin: 0 0 30px;
	
	
}


#footer .bnr-list{
	background: #fff;
	padding: 60px 1em 40px;
}

#footer .bnr-list ul{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	
}


#footer .bnr-list ul li{
	width: 80%;
	border: 1px solid #ccc;
	margin: 0 0 20px;
	
}








#footer .brand-list ul li img{
	
	
}

#footer .f-contact{
	display: none;
	text-align: center;
	background: #d5d5d5;
	padding: 70px 0 40px;
	
}


#footer .f-contact .title{
	color: #1b224c;
	font-size: 24px;
	font-weight: bold;
	margin: 0 0 25px;
	
}

#footer .f-contact .add-line a{
	background: #00acba;
	color: #fff;
	font-size: 14px;
	display: inline-block;
	padding: 15px 70px;
	border-radius: 25px;
	margin: 0 0 15px;
	
	
}


#footer .f-tel{
	padding: 20px 0 ;
	display: flex;
	justify-content: center;
	align-items: baseline;
	color: #1b224c;
}


#footer .f-tel a{
	padding: 0 10px;
	font-size: 30px;
	font-weight: bold;
	color: #1b224c;
}


#footer .f-info{
	padding: 50px 0;
	background: #1b224c;
	color: #fff;
}


#footer .f-info a{
	color: #fff;
}


#footer .f-info .inner{
	padding: 0 1em;
}
	


#footer .f-info .inner h2{
	margin: 0 0 20px;
	text-align: center;

}


#footer .f-info .inner .f-nav{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	text-align: center;

}


#footer .f-info .inner .f-nav .col{
	width: 33%;
	display: flex;
	flex-direction: column;
	margin: 0 0 20px;
	 
}

#footer .f-info .inner .f-nav .col:nth-of-type(4){
	 width: 100%;
	
}
#footer .f-info .inner .f-nav .col:nth-of-type(4) ul{
	display: flex;
	justify-content: center;
	
	

}

#footer .f-info .inner .f-nav .col:nth-of-type(4) ul li{
	padding: 0 10px ;
	

}



#footer .f-info .inner .f-nav .col h3{
	color: #00acba;
	margin: 0 0 25px;
	font-size: 14px;
}

#footer .f-info .inner .f-nav .col h3 a{
	color: #00acba;
}



#footer .f-info .inner .f-nav .col ul {
	
}


#footer .f-info .inner .f-nav .col ul li{
	font-size: 14px;
	margin: 0 0 20px;
	
}

#footer .f-info .inner .f-nav .col ul li.telno{
	margin-top: 100px;
}

#footer .f-info .inner .f-nav .col ul li.telno a{
	background: url(../images/common/i-tel.jpg) no-repeat 0 50%;
    padding: 5px 0 5px 23px;
    font-size: 14px;
    font-weight: bold;
}


#footer .f-info .inner .f-nav .col ul li.telno span{
	display: block;
	font-size: 10px;
	margin: 5px 0;
	
}





#footer .f-copy {
	padding: 15px 0;
}


#footer .f-copy ul {
	display: flex;
	justify-content: space-between;
	padding: 0 1em;
	
}

#footer .f-copy ul li{
	font-size: 14px;
}

#footer .f-copy ul li:last-child{
	font-size: 10px;
}