@charset "utf-8";
/*=============================================
 * body
 *=============================================*/

body {
	min-width: inherit;
	max-height: 100%;
	color: #000;
	font: normal normal 14px/2em "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	cursor: auto;
	letter-spacing: 0;
	word-spacing: normal;
	background:#FFF;
	font-weight: 500;
}
body.navOpen {
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
}
#hd_top,
#key,
main,
footer {
	transition: transform .8s ease .4s;
}
body.navOpen #hd_top,
body.navOpen #key,
body.navOpen main,
body.navOpen footer {
	transform: translateX(-80%);
	transition: transform .8s ease;
}
.fnt-mincho {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "メイリオ", Meiryo, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.fnt-meiryo {
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴシックPro", "ＭＳ ゴシック", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.fnt-gothic {
	font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}
.block::after {
	clear: both;
	content: "";
	display: block;
}
main {
	position: relative;
	z-index: 1;
}
/*=============================================
 * header
 *=============================================*/

header #belt {
	color: #fff;
	width: 100%;
	z-index: 9999;
	position: fixed;
}

@media screen and (min-width: 769px) {
	header #belt {
		left: 50%;
		transform: translateX(-50%);
		max-width: 769px;
		height: 79px;
		overflow: hidden;
	}
	
	header #hd_top {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 79px;
	}
	
	header h1 {
		padding: 0;
		flex-shrink: 0;
	}
	
	header #mail {
		padding: 0;
		width: auto;
		flex-shrink: 0;
	}
	
	header .navBtn {
		display: none;
	}
	
	header .menu_toggle {
		display: none !important;
	}
}

@media screen and (max-width: 768px) {
	header .navBtn {
		display: block;
	}
	
	header .menu_toggle {
		display: block !important;
	}
}
header #hd_top {
	z-index: 9999;
	position: relative;
	height: 79px;
	border-bottom: 1px solid #b6b6b6;
	background: #FFF;
}
header h1 {
	float: left;
    width: 41vw;
    padding: 1.5% 6% 0 2%;
}
header #mail{
	float: left;
	width: 38vw;
	padding-top: 1.5%;
}

header .ttl_key {
	position: absolute;
	bottom: 5%;
	left: 0;
	z-index: 99;
}
/*====================== header key ====================== */

header #key {
	position: relative;
	overflow: hidden;
	z-index: 10;
	padding-top: 80px;
}

header #key #logo{
	position: absolute;
	left: 0;
	top: 80px;
}
/*=============================================*/
/*                   　footer　　　　　          */
/*=============================================*/


footer {
	overflow: hidden;
	position: relative;
	font-size: 2.67vw;
}
footer #logo_ft {
	text-align: center;
	padding-bottom: 10px;
	margin: 0 10px;
}
footer ul{
	margin: 0 10vw;
	padding-bottom: 35px;
}
footer ul li{
	padding: 0 0 0 20px;
	position: relative;
	font-weight: 500;
}

footer ul li::before{
	content: "※";
	position: absolute;
	top: 0px;
	left: 0;
}

footer .address{
	text-align: center;
	padding-bottom: 15px;
}
/*=============================================*/
/*                   　index　　　　　          */
/*=============================================*/
#index #lead{
	padding: 15px 0 10px;
}

.btn_link{
	display: block;
	position: relative;
	-webkit-tap-highlight-color: transparent;
}

.btn_link::before{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	content: "";
	background: rgba(255,255,255,0.3);
	opacity: 0;
	transition: opacity 0.4s ease;
}

.btn_link.show::before{
	
	opacity: 1;
}

#index #lead ul.icon{
	padding-bottom: 5.4vh;
}

#index #lead ul.icon li{
	width: 33.3333334%;
	float: left;
}
#index #lead p.bnr{
	margin: 0 11.7vw;
	padding-bottom: 5vh;
}

#index #lead p.bnr span{
	display: block;
	font-weight: bold;
	text-align: center;
	font-size: 3vw;
}

#index #lead ul.list{
	margin: 0 4.2vw;
}

#index #lead ul.list li{
	margin-bottom: 6px;
}

#index #sec01 h3{
	padding: 4.5vh 0 2.6vh;
}

#index #sec01 .box{
	position: relative;
	background: #f5ffdd;
	padding: 0 0 16px;
}

#index #sec01 .box::before{
	width: 8px;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: #FFF;
	content: "";
}

#index #sec01 .box::after{
	width: 8px;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	background: #FFF;
	content: "";
}
#index #sec01 .box h4{
	position: relative;
	z-index: 2;
}

#index #sec01 .box .item{
	padding-top: 14px;
	margin: 0 8px;
}
#index #sec01 .box .item dl{
	width: 50%;
	float: left;
	text-align: center;
}

#index #sec01 .box .item dl dt{
	max-width: 218px;
	margin: auto;
}
#index #sec01 .box .item dl dd{
	max-width: 236px;
	margin: auto;
	font-weight: bold;
	font-size: 2.6vw;
	padding-top: 5px;
	line-height: 24px;
}

#index #sec01 .box .item dl dd span.i_b{
	display: inline-block;
	margin-left: -3px;
}

#index #sec01 .box .item dl dd span.note_span{
	display: block;
	background: #e1f2b6;
	text-align: left;
	font-size: 14px;
	line-height: 20px;
	padding: 5px 10px;
	width: 238px;
	margin:10px 0 0 -10px;
}

#index #sec02{
	position: relative;
	padding: 15px 0 50px;
}

#index #sec02 dl{
	background: url(../img/index/bg1.jpg) repeat;
	padding: 10px 0;
	position: relative;
	margin-bottom: 20px;
	border-right: 8px solid #FFF;
}

#index #sec02 dl::before{
	width: 8px;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: #FFF;
	content: "";
}

#index #sec02 dl dt{
	position: relative;
	z-index: 1;
	width: 68vw;
	float: left;
}

#index #sec02 dl dd{
	font-weight: bold;
	font-size: 2.67vw;
	padding-top: 42px;
	line-height: 24px;
	width: 25vw;
	float: right;
	text-align: center;
	margin-right: 2.5vw;
}

#index #sec02 dl dd span{
	font-size: 12px;
}

#index #sec02 p.txt{
	margin: 0 4.15vw;
	font-size: 2.6vw;
	padding-top: 5px;
	line-height: 24px;
	
}

#index #sec03{
}

#index #sec03 .box{
	border: 1px solid #000;
	margin: 0 8px;
	position: relative;
	padding-bottom: 7px;
}

#index #sec03 .box::before{
	background: #b2b2b2;
	width: 1px;
	height: 100%;
	content: '';
	position: absolute;
	top: 0;
	left: 33.33334%;
}

#index #sec03 .box::after{
	background: #b2b2b2;
	width: 1px;
	height: 100%;
	content: '';
	position: absolute;
	top: 0;
	left: 66.66667%;
}

#index #sec03 .head_sec03 dl{
	width: 33.3333334%;
	float: left;
	font-weight: bold;
}

#index #sec03 .head_sec03 dl dt{
	border-bottom: 1px solid #b2b2b2;
}

#index #sec03 .head_sec03 dl dd{
	border-bottom: 1px solid #b2b2b2;
	text-align: center;
}

#index #sec03 .head_sec03 dl dd.row1{
	padding: 22px 0;
}

#index #sec03 .head_sec03 dl dd.row1 span.price{
	font-size: 21px;
}
#index #sec03 .head_sec03 dl dd.row2{
	font-size: 16px;
	padding: 10px 0;
}

#index #sec03 .head_sec03 dl dd.row2 span.fz1{
	font-size: 18px;
}

#index #sec03 .head_sec03 dl dd.row2 span.fz1 span.fz2{
	font-size: 12px;
}

#index #sec03 .note_txt{
	    margin: 8px 5px 0;
    position: relative;
    z-index: 1;
    background: #8fc31f;
    color: #FFF;
    padding: 14px 10px 10px;
    text-align: center;
    font-size: 3vw;
    font-weight: bold;
    line-height: 24px;
}

#index #sec03 .note_txt span{
	display: block;
	font-size: 4vw;
	padding-bottom: 8px;
}

#index #sec03 .bottom_sec03 ul{
	border: 1px solid #8fc31f;
	margin: 0 5px;
}

#index #sec03 .bottom_sec03 ul li{
	width: 33.33334%;
	float: left;
	text-align: center;
	font-size: 6vw;
	background: #e7fabf;
}

#index #sec03 .bottom_sec03 dl{
	border: 1px solid #ef7aae;
	margin: 0 5px;
	background: url(../img/index/bg1.jpg) repeat;
	text-align: center;
}

#index #sec03 .bottom_sec03 dl dt{
	background:#ef7aae;
	font-size: 4vw;
	color: #FFF;
	padding: 10px 0;
	font-weight: bold;
	position: relative;
	z-index: 2;
}
#index #sec03 .bottom_sec03 dl dd{
	width: 33.33334%;
	float: left;
}
#index #sec03 p.note{
	font-size: 2.67vw;
	text-align: right;
	margin: 0 5px;
	padding: 0 0 15px;
	font-weight: bold;
}
#index #sec03 p.txt{
	margin: 0 4.15vw;
    font-size: 2.67vw;
    padding: 5px 0 40px;
    line-height: 24px;
}

#index #sec03 p.bnr{
	margin: 0 11.7vw;
	padding-bottom: 6vh;
}

#index #sec03 p.bnr span{
	display: block;
	font-weight: bold;
	text-align: center;
	font-size: 3vw;
}

#index #sec04{
}

#index #sec04 .box{
	margin: 38px 5px 0;
	/*background: #f3eadb;*/
	padding-bottom: 14px;
}

#index #sec04 .box h3{
	width: 44vw;
	margin-bottom: 15px;
}
#index #sec04 .box h3 img{
	margin-top: -20px;
}

#index #sec04 .box p.note{
	text-align: center;
	font-weight: bold;
	font-size: 3.5vw;
	margin: 0 10px;
}

#index #sec04 .box p.note span{
	color: #e5004f;
}

#index #sec05{
	padding: 60px 0 70px;
}

#index #sec05 p.note{
	text-align: center;
	font-weight: bold;
	font-size: 3.5vw;
	padding: 20px 10px 35px;
}

#index #sec05 ul{
	margin-bottom: 10px;
	padding: 0 5vw;
}

#index #sec05 ul li{
	float: left;
	margin: 0 3% 25px;
	width: 44%;
}
#index #sec05 p.txt{
	margin: 0 3.5vw;
	/*font-size: 2.67vw;*/
	font-size: 2.47vw;
	padding-left: 35px;
	position: relative;
}

#index #sec05 p.txt span{
	position: absolute;
	top: 0;
	left: 0;
}

#index #sec06{
	padding-bottom: 55px;
}

#index #sec06 h2{
	margin-bottom: 7px;
}

#index #sec06 dl{
	margin: 0 4.16vw;
	padding: 30px 0;
	background: url(../img/index/line.png) repeat-x bottom center;
}

#index #sec06 dl dt{
	position: relative;
	margin-left: 12px;
	color: #005752;
	font-weight: bold;
	font-size: 3.5vw;
	padding: 5px 0 5px 90px;
}

#index #sec06 dl dt span{
	padding: 10px 0;
	display: block;
}

#index #sec06 dl dt::before{
	width: 70px;
	height: 58px;
	background: url(../img/index/q.png) no-repeat;
	content: "";
	position: absolute;
	top: 0;
	left: 0;
}

#index #sec06 dl dd{
	margin-left: 18px;
	padding-top: 15px;
	font-size: 2.67vw;
}

#index #sec07{
	padding-bottom: 50px;
}

#index #sec07 h2{
	padding-bottom: 25px;
}

#index #sec07 ul{
	margin: 0 4.16vw;
	padding-bottom: 60px;
}

#index #sec07 ul li{
	padding: 8px 0 8px 20px;
	position: relative;
	font-size: 2.67vw;
}

#index #sec07 ul li::before{
	content: "※";
	position: absolute;
	top: 8px;
	left: 0;
}

#index #sec07 p.tel{
	text-align: center;
	font-size: 2.67vw;
	padding-bottom: 25px;
}

#index #sec07 p.tel span.tel_number{
	position: relative;
	padding-bottom: 25px;
}

#index #sec07 p.tel span.tel_number span{
	font-size: 12px;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 200%;
	text-align: left;
}

#index #sec07 p.bnr{
	margin: 0 11.7vw;
	padding-bottom: 6vh;
}

#index #sec07 p.bnr span{
	display: block;
	font-weight: bold;
	text-align: center;
	font-size: 3vw;
}

@media (max-width: 550px) and (min-width: 440px) {
    header h1 {
		padding: 3% 4% 0 2%;
	}
	header #mail {
    width: 36vw;
    padding-top: 3%;
	}
	#index #sec02 dl dd {
		font-size: 3vw;
	}
	#index #sec02 dl dd{
		padding-top: 20px;
	}
}

@media (max-width: 439px) and (min-width: 365px) {
	header #hd_top{
		height: 75px;
	}
    header h1 {
		padding: 5.5% 5% 0 1%;
	}
	header #mail {
    width: 34vw;
    padding-top: 5.5%;
	}
	header .navBtn{
		right: 8px;
		top: 15px;
		width: 47px;
		height: 45px;
	}
	header .navBtn span::before{
		left: 8px;
		top: 15px;
	}
	
	header .navBtn span::after{
		left: 8px;
		top: 23px;
	}
	header .navBtn::before{
		left: 8px;
		top: 31px;
	}
	#index #sec02 dl dd {
		font-size: 3.5vw;
		line-height: 3.3vh;
	}
	#index #sec02 dl dd{
		padding-top: 0;
	}
	
	#index #sec03 .head_sec03 dl dd.row1 span.price{
		font-size: 18px;
	}
	#index #sec03 .head_sec03 dl dd.row1 span.price1{
		display: block;
	}
	#index #sec03 .head_sec03 dl dd.row2 span.d_ib{
		display: block;
	}
	#index #sec03 .note_txt{
		font-size: 3.5vw;
	}
	#index #sec03 .note_txt span{
		font-size: 4.5vw;
	}
	#index #sec04 .box h3{
		margin-bottom: 5px;
	}
	#index #sec03 p.note, #index #sec03 p.txt, #index #sec05 p.txt, #index #sec07 ul li, #index #sec07 p.tel{
		font-size: 3vw;
	}
	#index #sec06 dl dt{
		font-size: 4vw;
		padding: 0px 0 0px 65px;
	}
	#index #sec06 dl dd{
		font-size: 3.5vw;
	}
	#index #sec05{
		/*padding: 60px 0 55px;*/
 		padding: 40px 0 55px!important;
	}
	#index #sec06 dl dt::before {
		width: 55px;
		height: 43px;
		background: url(../img/index/q.png) no-repeat;
		background-size: 100% 100%;
	}
	#index #sec07{
		padding-bottom: 15px;
	}
	#index #sec07 ul {
		padding-bottom: 40px;
	}
	#index #sec07 h2{
		overflow: hidden;
	}
	
	#index #sec07 h2 img{
		width: 110%;
		margin-left: -5%;
	}
	#index #sec07 p.tel span.tel_number span{
		font-size: 11px;
		left: inherit;
		right: 0;
		text-align: right;
	}
	footer{
		font-size: 3.5vw;
	}
}



@media (max-width: 364px) and (min-width: 319px) {
	header #hd_top{
		height: 75px;
	}
    header h1 {
		padding: 7% 2% 0 2%;
	}
	header #mail {
    width: 34vw;
    padding-top: 7%;
	}
	header .navBtn{
		right: 8px;
		top: 15px;
		width: 47px;
		height: 45px;
	}
	header .navBtn span::before{
		left: 8px;
		top: 15px;
	}
	
	header .navBtn span::after{
		left: 8px;
		top: 23px;
	}
	header .navBtn::before{
		left: 8px;
		top: 31px;
	}
	#index #sec02 dl dt {
		width: 100%;
		clear: both;
	}
	#index #sec02 dl dd{
		width: 90%;
		margin: 0 5%;
		font-size: 3.6vw;
	}
	#index #sec02 dl dd{
		padding-top: 0;
	}
	#index #sec03 .head_sec03 dl dd.row1 span.price{
		font-size: 18px;
	}
	#index #sec03 .head_sec03 dl dd.row1 span.price1{
		display: block;
	}
	#index #sec03 .head_sec03 dl dd.row2{
		font-size: 14px;
	}
	#index #sec03 .head_sec03 dl dd.row2 span.fz1{
		font-size: 16px;
	}
	#index #sec03 .note_txt{
		font-size: 3.5vw;
	}
	#index #sec03 .note_txt span{
		font-size: 4.5vw;
	}
	#index #sec03 .bottom_sec03 dl dt{
		font-size: 4.5vw;
		padding: 5px 0;
	}
	#index #sec03 p.txt, #index #sec03 p.note{
		font-size: 3.5vw;
	}
	#index #sec04 .box h3{
		width: 47vw;
		margin-bottom: 0;
	}
	#index #sec04 .box p.note{
		font-size: 4vw;
	}
	#index #sec05 p.note{
		font-size: 4vw;
	}
	#index #sec05 p.txt{
		font-size: 3.6vw;
		padding-left: 29px;
		line-height: 22px;
	}
	#index #sec06 dl dt{
		font-size: 4.5vw;
		padding: 0px 0 0px 55px;
	}
	#index #sec06 dl dd{
		font-size: 3.5vw;
		line-height: 22px;
		padding-top: 8px;
	}
	#index #sec06 dl dt::before {
		width: 48px;
		height: 38px;
		background: url(../img/index/q.png) no-repeat;
		background-size: 100% 100%;
	}
	#index #sec07 h2{
		overflow: hidden;
	}
	
	#index #sec06 dl dt span{
		padding: 6px 0;
	}
	
	#index #sec07{
		padding-bottom: 5px;
	}
	
	#index #sec07 h2 img{
		width: 120%;
		margin-left: -10%;
	}
	#index #sec07 ul li{
		font-size: 3.5vw;
		line-height: 22px;
	}
	#index #sec07 p.tel{
		font-size: 3.5vw;
	}
	#index #sec07 p.tel span.tel_number span{
		font-size: 10px;
		left: inherit;
		right: 0;
		text-align: right;
	}
	#index #sec07 ul{
		padding-bottom: 30px;
	}
	footer{
		font-size: 3.5vw;
		line-height: 22px;
	}
	footer ul {
    margin: 0 6vw;
    padding-bottom: 35px;
}
}

@media (max-width: 480px) and (min-width: 374px) {
    #index #sec01 .box .item dl dt {
		max-width: 150px;
		margin: auto;
	}
	#index #sec01 .box .item dl dd{
		font-size: 3.2vw;
		max-width: 165px;
	}
	#index #sec01 .box .item dl dd span.i_b{
		display: inline;
	}
	
	
	#index #sec01 .box .item dl dd span.note_span{
		width: 150px;
		margin: 10px 0 0 0;
		font-size: 12px;
	}
	#index #sec02 p.txt{
		font-size: 3vw;
	}
}

@media (max-width: 373px){
	
	#index #sec01 .box .item dl dt{
		padding: 0 5%;
	}
	#index #sec01 .box .item dl dd{
		font-size: 2.8vw;
		padding: 0 5%;
		line-height: 20px;
	}
	#index #sec01 .box .item dl dd span.note_span{
		font-size: 2.5vw;
		display: block;
    background: #e1f2b6;
    text-align: left;
    line-height: 20px;
    padding: 5px 10px;
    width: 127px;
    margin: 10px 0 0 0px;
	}
	#index #sec02 p.txt{
		font-size: 3.5vw;
	}
}







body.navOpen,
body.navOpen *,
body.navOpen *:hover,
body.navOpen *:focus,
body.navOpen *:active {
	cursor: none !important;
	touch-action: none !important;
	pointer-events: none !important;
}
/*
body.navOpen .navBtn {
	cursor: pointer !important;
}
body.navOpen .navBtn:hover,
body.navOpen .navBtn:active {
	cursor: default !important;
	touch-action: none !important;
}
*/
body.navOpen .navBtn,
body.navOpen #menu_toggle,
body.navOpen #menu_toggle * {
	touch-action: auto !important;
	pointer-events: visible !important;
}