@charset "utf-8";
.view{display: inline-block; width: 280px; padding: 15px 0; line-height: 180%; background: #000; color: #fff; text-align: center;font-family: hiragino-kaku-gothic-pron, sans-serif; font-weight: 300; font-style: normal; letter-spacing: 0.1em;}
a{ position: relative; z-index: 100; }
a.view:visited { color: #fff; text-decoration: none;}
body{min-width: 1200px;}
/*-------------------------------- header ---------------------------------*/
header{height: auto; position: fixed; background: #fff; width: 100%;  min-width: 1200px; z-index: 1000;box-shadow: 2px 3px 20px rgba(0,0,0,0.1);}
header .header_box{display: flex; align-items: center; width: 100%;justify-content: space-between;padding: 0 0 0 30px; }
header .menu_2{margin-left: auto;}
header .title h1{display: inline-block;font-family: ten-mincho, serif; font-weight: 400; font-style: normal;}
header .title p{font-size: 12px; line-height: 150%; padding-left: 10px;}
header nav ul{display: flex; align-items: center;}
header nav ul li{padding: 0 30px 0 0;}
header nav ul li a{font-size: 14px; line-height: 180%; color: #000;font-family: hiragino-kaku-gothic-pron, sans-serif; font-weight: 300; font-style: normal;}
header nav ul li a:visited {color: #000;}
header .btn_flex .tel_box{margin-right: 0px; padding: 27px 0 26px;}
header .btn_flex .contact_box {padding: 38px 0 37px;}
/*-------------------------------- .btn_flex ---------------------------------*/
.flex_box{display: flex; align-items: center;}
.btn_flex{display: flex; align-items: center;}
.btn_flex a{display: block; text-align: center; }
.btn_flex .tel_box{background: #FFF100; font-size: 12px; line-height: 160%; padding: 10px 0 5px; width: 275px;font-family: hiragino-kaku-gothic-pron, sans-serif; font-weight: 300; font-style: normal;}
.btn_flex .tel_box span{font-size: 26px; background: url(../images/common/icn_1.svg) no-repeat center left; background-size: 16px; display: inline-block; padding-left:18px;font-family: hiragino-mincho-pron, sans-serif; font-weight: 300; font-style: normal;}
.btn_flex .contact_box{background: #E38092 ; width: 180px; padding: 18px 0; line-height: 160%; font-family: hiragino-kaku-gothic-pron, sans-serif; font-weight: 300; font-style: normal;}
.btn_flex .contact_box span{background: url(../images/common/icn_2.svg) no-repeat center left; color: #fff; background-size: 21px; display: inline-block; padding-left: 24px; letter-spacing: 0.1em;font-family: hiragino-kaku-gothic-pron, sans-serif; font-weight: 300; font-style: normal;line-height: 160%;}


/*-------------------------------- #cta ---------------------------------*/
#cta{padding: 110px 30px 0;}
#cta .cta_box{background: url(../images/common/bg_3.jpg?var=123112) no-repeat center center; background-size: cover; border-radius: 15px; padding: 96px 0 152px;}
#cta .cta_box .tt_box{width: 493px; margin: 0 0 0 auto; text-align: center;}
#cta .cta_box .tt_box h3{display: inline-block;}
#cta .cta_box .tt_box p{line-height: 180%; font-size: 24px; line-height: 200%; padding: 20px 0 0;font-family: hiragino-kaku-gothic-pron, sans-serif; font-weight: 300; font-style: normal;}
#cta .cta_box .tt_box a{margin: 40px 0 0; color: #fff;}


/*-------------------------------- footer ---------------------------------*/
footer{padding: 70px 0 96px;}
footer .footer_inner{ width: 100%; max-width: 1300px; margin: 0 auto; padding: 0 50px;}
footer .footer_inner .copy{font-size: 12px; text-align: left;font-family: hiragino-kaku-gothic-pron, sans-serif; font-weight: 300; font-style: normal; padding: 30px 0 0;}
footer .footer_box{width: 100%; margin: 0 auto; display: flex;}
footer .footer_box .info{width: auto; }
footer .footer_box .info h3{} 
footer .footer_box .info p{font-size: 15px; line-height: 180%; padding: 25px 0 0;font-family: hiragino-kaku-gothic-pron, sans-serif; font-weight: 300; font-style: normal;}
footer .footer_box .link{width: 645px; margin: 0 0 0 auto;}
footer .footer_box .link ul{ display: flex; align-items: center; justify-content: space-between; width: 100%; height: auto; padding: 25px 0 0;}
footer .footer_box .link ul li{ width: calc(100% / 4 - 1%); border-width: 1.5px; border-style: solid; }
footer .footer_box .link ul li:first-of-type{ border-color: #f2efd3; }
footer .footer_box .link ul li:nth-of-type(2){ border-color: #e7babf; }
footer .footer_box .link ul li:nth-of-type(3){ border-color: #E38092; }
footer .footer_box .link ul li:last-of-type{ border-color: #e5d075; }

footer .footer_box .link ul li:hover:first-of-type{ background: #f2efd3; }
footer .footer_box .link ul li:hover:nth-of-type(2){ background: #e7babf; }
footer .footer_box .link ul li:hover:nth-of-type(3){ background: #E38092; }
footer .footer_box .link ul li:hover:last-of-type{ background: #e5d075; }

footer .footer_box .link ul li a{ height: 60px; display: flex; align-items: center; justify-content: center; letter-spacing: 0.1em; color: #000; font-size: 12px; text-align: center; font-family: hiragino-kaku-gothic-pron, sans-serif; font-weight: 300; font-style: normal; line-height: 160%;}
footer .footer_box .link .btn_flex{padding: 5px 0 0; flex-direction: row; max-width: 100%;}
footer .footer_box .link .btn_flex .tel_box{margin-right: 10px;width: calc(100% / 2 - 1%);}
footer .footer_box .link .btn_flex .contact_box{width: 316px;}
footer .pagetop { position: fixed; right: 30px; bottom: 30px; z-index: 5;}


footer .footer_box .info p.copy{padding: 31px 0 0; font-size: 12px; letter-spacing: 0.1em;}
/* ---------------------------------------- #bread ---------------------------------------- */
#bread{max-width: 1400px; min-width: 1100px; margin: 0 auto; padding: 0 50px;}
#bread ol{display: flex; margin-top: 22px;}
#bread ol li{font-size: 12px; }
#bread ol li:not(:last-child){padding-right: 60px; position: relative;}
#bread ol li:not(:last-child):before{content: ""; background: #000000; width: 30px; height: 1px; display: block; position: absolute; right: 17px; top: 5px;}
    
@media only screen and (max-width: 1520px) {
	body.stop{overflow: hidden;}
	header{padding: 10px 30px;}
	header .icn_box{ display: flex; align-items: center; justify-content: space-between; margin: 0 0 0 auto;}
	header .menu_2 {position: absolute;height: 100vh; width: 100%; right: 0px; top: 0px; background: #fff; }
	header .flex_box{padding:100px 0 0;flex-direction: column}
	header .menu_2 .flex_box .title{text-align: center; width: 100%; display: block;}
	header .menu_2 .flex_box .title img{display: inline-block;}
	header nav{width: 50%; margin: 0 auto; padding: 40px 0 0;}
	header nav ul{display: flex; flex-direction: column; width: 100%; margin: 0 auto;}
	header nav ul li{ width: 100%;border-bottom: 1px solid #000; padding: 0px}
	header nav ul li:first-child{border-top: 1px solid #000;}
	header nav ul li a{display: block;padding: 15px 0; position: relative;}
	header nav ul li a:after{content: ""; width: 10px; height: 10px; display: block; position: absolute; right: 0px; transform: translateY(-50%) rotateZ(-45deg); top: 50%; border-bottom: 1px solid #000; border-right: 1px solid #000; }
	header .icn_box .tel_btn{display: inline-block; height: 40px; width: 40px; background: url(../images/common/icn_1.svg) no-repeat center center,#FFF100;background-size: 20px; margin: 0 10px 0 0;}
	header .icn_box .cnt_btn{display: inline-block; height: 40px; width: 40px; background: url(../images/common/icn_2.svg) no-repeat center center,#E38092; background-size: 20px; margin: 0 10px 0 0;}
	header .icn_box .btn_hdr{display: inline-block; height: 40px; width: 40px; position: relative;z-index: 1000;}
	header .icn_box .btn_hdr .close_menu{display: none; width: 20px; height: 20px; margin: 10px;}
	header .icn_box .active.btn_hdr .sp_menu{display: none;}
	header .icn_box .active.btn_hdr .close_menu{display: block;}
	.btn_flex{flex-direction: column; align-items: flex-start; padding: 40px 0 0; width: 100%; max-width: 300px;}	
	header .menu_2{display: none; }
	
	header .btn_flex .tel_box{  padding: 10px 0 5px; width: 100%; display: block;}
	header .btn_flex .contact_box{ width: 100%; padding: 15px 0;margin: 10px 0 0; display: block;}
	header .copu_tt{padding: 20px 0 0; font-size: 11px;width: 90%; margin: 0 auto; line-height: 160%; text-align: center;}
	
}
@media only screen and (max-width: 768px) {
	body{min-width: auto;}
	.view{width: 65%; padding: 14px 0; font-size: 13px;}
	.flex_box{flex-direction: column; align-items: flex-start;}
	/*-------------------------------- header ---------------------------------*/
	header{min-width: auto; padding: 0px}
	header .header_box{padding: 10px 15px; }
	header .title h1{display: inline-block; width: 160px; height: auto; }
	header .title p{font-size: 11px; padding-left: 10px;}
	header nav ul li a{font-size: 14px; line-height: 180%; padding: 7px 0;}
	header .btn_flex{ width: 80%; margin: 0 auto;}
	header .btn_flex .tel_box{margin-right: 5px;}
	header nav{width: 80%; margin: 0 auto;padding: 30px 0 0;}
	
	header .btn_hdr{width: 35px; height: 28px; position: relative; z-index: 10;transition: 0.5s;margin: 0 0 0 auto;}
	header .btn_hdr span{ width: 100%; height: 3px; background: #000; transition: 0.5s; display: block; position: absolute;transition: 0.5s;}
	header .btn_hdr span.top{top: 0px;}
	header .btn_hdr span.bottom{bottom: 0px;}
	header .btn_hdr span.center{transform: translateY(-50%); top: 50%; }
	header .btn_hdr.active span.top{ top: 50%; transform: translateY(-50%) rotateZ(-45deg); }
	header .btn_hdr.active span.bottom{bottom: auto; top: 50%; transform: translateY(-50%) rotateZ(45deg); }
	header .btn_hdr.active span.center{opacity: 0; }
	header .btn_flex .tel_box {width: 100%;}
	header .btn_flex .contact_box { width: 100%; padding: 15px 0px; }
	/*-------------------------------- .btn_flex ---------------------------------*/
	.btn_flex .tel_box{ font-size: 11px; padding: 10px 0 5px; width: 100%;}
	.btn_flex .tel_box span{font-size: 24px; background: url(../images/common/icn_1.svg) no-repeat center left; background-size: 16px; display: inline-block; padding-left:22px; letter-spacing: 0.1em;}
	.btn_flex .contact_box{ width: 100%; padding: 15px 0;margin: 8px 0 0;}
	.btn_flex .contact_box span{background: url(../images/common/icn_2.svg) no-repeat center left; background-size: 18px; padding-left:26px; }
	
	.btn_flex{flex-direction: column;}
	/*-------------------------------- #cta ---------------------------------*/
	#cta{padding: 55px 15px 0;}
	#cta .cta_box{background: url(../images/common/bg_3_sp.jpg?var=123112) no-repeat center left 20%; background-size: cover; padding: 15px 0;}
	#cta .cta_box .tt_box{width: 145px; margin: 0 0 0 auto; text-align: center;}
	#cta .cta_box .tt_box h3{width: 95%; height: auto; margin: 0 auto 0 0; display: block;}
	#cta .cta_box .tt_box h3 img{width: 100%; height: auto; display: block;}
	#cta .cta_box .tt_box p{font-size: 14px; padding: 5px 0 0; font-family: hiragino-kaku-gothic-pron, sans-serif; font-weight: 300; font-style: normal; text-align: left;}
	#cta .cta_box .tt_box a{margin: 10px 0 0; width: 100%; padding: 7px 0}
	
	
	/*-------------------------------- footer ---------------------------------*/
	footer{padding: 35px 0 48px;}
	footer .footer_inner {width: 90%;padding: 0;}
	footer .footer_box{width: 100%; margin: 0 auto; display: flex; flex-direction: column;}
	footer .footer_box .info{width: 100%; margin-right: 122px;}
	footer .footer_box .info h3{width: 144px; height: auto;} 
	footer .footer_box .info p{font-size: 12px; padding: 12px 0 0;}
	footer .footer_box .link{width:100%; padding: 20px 0 0; margin: 0 auto;}
	footer .footer_box .link ul{ flex-wrap: wrap; width: 100%; height: auto; margin: 0 auto; }
	footer .footer_box .link ul li{ width: calc(100% / 2 - 1%); margin: 0 0 20px; }
/* 	footer .footer_box .link ul li:not(:nth-child(3n)) {padding: 0 10px 12px 0;} */
	footer .footer_box .link ul li a{ font-size: 11px; letter-spacing: 0.05em;}
	footer .footer_box .link .btn_flex{padding: 0; flex-direction: column; max-width: 280px; margin: 0 auto;}
	footer .footer_box .link .btn_flex .tel_box{margin-right: 0px; width: 100%;} 
	footer .footer_box .link .btn_flex .contact_box{width: 100%;}
	footer .footer_box .link p{padding: 15px 0 0; font-size: 11px; line-height: 160%;text-align: center;}
	footer .footer_inner .copy{font-size: 10px; padding: 30px 0 0;}
	
	footer .pagetop { right: 10px; bottom: 10px; width: 40px; height: 40px;}
	footer .pagetop img{width: 100%; height: auto;}
	
	#bread{max-width: none; min-width: auto; margin: 0 auto; padding: 0 25px;}
	#bread ol{display: flex; margin-top: 22px;}
	#bread ol li{font-size: 12px; }
	#bread ol li:nth-child(1){padding-right: 36px; position: relative;}
	#bread ol li:nth-child(1):before{content: ""; background: #000000; width: 20px; height: 1px; display: block; position: absolute; right: 8px; top: 5px;}
	#bread ol li:not(:last-child){padding-right: 36px; position: relative;}
	#bread ol li:not(:last-child):before{ width: 20px;right: 8px; top: 5px;}
}