@charset "utf-8";
body{background: #fff; width: 100%; }
#spot.salon{padding: 50px 6%; margin: 0 auto; max-width: 780px; }
#spot.salon .header h2{font-family: "source-han-sans-japanese", sans-serif; font-weight: 500; font-style: normal; text-align: center; font-size: 30px;}
#spot.salon .main{padding: 64px 0 0;}
#spot.salon .main form{padding: 0 0 46px;}
#spot.salon .main form table{width: 100%;}
#spot.salon .main form label{font-size:16px;font-family: "source-han-sans-japanese", sans-serif; font-weight: 500; font-style: normal; padding: 0 31px 0 0; line-height: 160%;}

#spot.salon .main form p.text{text-align: center; font-size: 13px; padding: 20px 0 0;line-height: 160%;}
#spot.salon .main form p.text.text_2{padding: 10px 0 0;padding: 10px 0 0; font-weight: 400;}
#spot.salon .main form select{-webkit-appearance: none;  appearance: none; border: 1px solid #dadada; background: #fff;font-family: "source-han-sans-japanese", sans-serif; font-weight: 300; padding: 9px 14px 8px; border-radius: 5px;line-height: 160%; color: #000; width: 100%;}
#spot.salon .main form .select_box.set_1{width: 281px;}
#spot.salon .main form .select_box.set_2{width: 161px;}
#spot.salon .main form .select_box{position: relative;}
#spot.salon .main form .select_box:before{content: "";position: absolute; width: 6px; height: 6px;border-bottom: 1px solid #8e8f9d; border-right: 1px solid #8e8f9d; transform: rotate(-135deg); right: 15px; top: 12px;}
#spot.salon .main form .select_box:after{content: "";position: absolute; width: 6px; height: 6px;border-bottom: 1px solid #8e8f9d; border-right: 1px solid #8e8f9d; transform: rotate(45deg); right: 15px; bottom: 12px;}
#spot.salon .main form td .chek_box{display: flex;align-items: center;}


#spot.salon .main form td .chek_box input{ display: none; width: 100%; }

#spot.salon .main form td .chek_box .ck_box input:checked + span::after{ content: ""; position: absolute; top: 4px; left: 4px; width: 9px; height: 5px; border-left: 2px solid #fff;border-bottom: 2px solid #fff; transform: rotate(-54deg); z-index: 1; display: block;;}
#spot.salon .main form td .chek_box .ck_box input:checked + span{ background: #0000ff;}
    
#spot.salon .main form td .chek_box .ck_box{position: relative; }
#spot.salon .main form td .chek_box .ck_box span{border: 2px solid #dadada; width: 18px; height: 18px; border-radius: 5px; margin: 0 5px 0 0; display: block; position: relative;}
/*
#spot.salon .main form td .chek_box input[type="checkbox"]:checked::before{ content: ""; position: absolute; top: 5px; left: 2px; display: inline-block; width: 8px; height: 5px; border-left: 2px solid #fff;border-bottom: 2px solid #fff; transform: rotate(-54deg); z-index: 1;}
#spot.salon .main form td .chek_box input{-webkit-appearance: none; appearance: none; border: 1px solid #dadada; width: 19px; height: 19px; border-radius: 5px; margin: 0 5px 0 0; line-height: 160%; padding: 0 8px;}
*/


#spot.salon .main form .chek_box:nth-child(1){padding: 0 26px 0 0;}
#spot.salon .main form td .check{display: flex; padding: 26px 0 22px;line-height: 160%;}
#spot.salon .main form th.check{padding: 26px 0 22px;}

#spot.salon .main ul {width: 100%;}

#spot.salon .main ul li .img.SP{display: none;}
#spot.salon .main ul li .img.PC{display: block;}
#spot.salon .main ul li:not(:last-child){padding: 0 0 42px;}
#spot.salon .main ul li .list_box{display: flex; width: 100%;}
#spot.salon .main ul li .img{width: 139px; height: auto; margin: 0 23px 0 0;}
#spot.salon .main ul li .img img{width: 100%; height: auto; padding: 0px;}
#spot.salon .main ul li .text_box{width: calc(100% - 161px);}
#spot.salon .main ul li .text_box a{color: #000; text-decoration: none; display: block;width: 100%; line-height: 200%; font-size: 15px;}
#spot .main p.text_2{font-family: "游ゴシック体", "Yu Gothic", "YuGothic", "Hiragino Kaku Gothic Pro", "Meiryo", "メイリオ", "Osaka", "ＭＳ Ｐゴシック", "MS P Gothic", "Arial", sans-serif; font-weight: 700;}
#spot.salon .main ul li .text_box h3{font-size: 13px;font-family: "source-han-sans-japanese", sans-serif; font-weight: 500; font-style: normal;  line-height: 160%;}
#spot.salon .main ul li .text_box h3 span{ font-size: 20px; color: #FF7288;}
#spot.salon .main ul li .flex_box{display: flex;align-items: center; margin: 10px 0 0;border: 1px solid #000;}
#spot.salon .main ul li .flex_box p{ font-size: 15px;font-family: "source-han-sans-japanese", sans-serif; font-weight: 500; font-style: normal;  line-height: 100%;}
#spot.salon .main ul li .flex_box table tr th{ border-right: 1px solid #000;width: 100px;}
#spot.salon .main ul li .flex_box table tr td{width: calc(100% - 100px);}
#spot.salon .main ul li .flex_box p.coupon{width: auto;padding: 4px 0px 5px; text-align: center;line-height: 160%;}
#spot.salon .main ul li .flex_box p.cut{width: auto; padding: 4px 15px 5px; line-height: 160%;}
#spot.salon .main ul li .flex_box p span.new{color: #fff; background: #be484e; font-size: 13px; display: inline-block; padding:2px 3px 4px; margin: 0 12px 0 0;}


#spot.salon .main ul li .text_box p.adress span.tt_link_box{display: block;line-height: 200%;}
#spot.salon .main ul li .text_box a.link_box{line-height: 100%;}
#spot.salon .main ul li .text_box a.link_box span{width: auto; border-bottom: 1px solid #00cbbf; color: #00cbbf; line-height: 200%;padding: 0 0 5px;}

@media only screen and (max-width:640px){

	#spot.salon{padding: 25px 5%;}
	#spot.salon .header h2{ font-size: 20px;}
	#spot.salon .main{padding: 32px 0 0;}
	#spot.salon .main form{padding: 0 0 23px;}
	#spot.salon .main form label{font-size:13px; padding: 0 5px 0 0; }
	#spot.salon .main form select{padding: 9px 14px 8px; border-radius: 5px; font-size: 13px;}
	#spot.salon .main form .select_box.set_1{width: 100%;}
	#spot.salon .main form .select_box.set_2{width: 100%;}
	#spot.salon .main form td .chek_box .ck_box input:checked + span::after{ top: 3px; left: 3px; width: 6px; height: 4px;}
    
	#spot.salon .main form td .chek_box .ck_box span{border: 1px solid #dadada; width: 13px; height: 13px; border-radius: 5px; margin: 0 5px 0 0; }
	
	#spot.salon .main form td .select_box:before{ width: 6px; height: 6px; right: 10px; top: 8px;}
	#spot.salon .main form td .select_box:after{width: 6px; height: 6px;right: 10px; bottom: 8px;}
	#spot.salon .main form .chek_box:nth-child(1){padding: 0 13px 0 0;}
	#spot.salon .main form td .check{display: flex; flex-direction: column; padding: 15px 0 11px;}
	#spot.salon .main form th.check{padding: 15px 0 11px}
	#spot.salon .main form td .check p{font-size: 12px;}
	
	
	#spot.salon .main ul li .list_box{display: flex; width: 100%;flex-direction: column;}
	#spot.salon .main ul li:not(:last-child){padding: 0 0 42px;}
	#spot.salon .main ul li{ }
	#spot.salon .main ul li .img{width: 38%; height: auto; margin: 0 5% 0 0;}
	#spot.salon .main ul li .img.SP{display: block;}
	#spot.salon .main ul li .img.PC{display: none;}
	#spot.salon .main ul li .img img{width: 100%; height: auto; padding: 0px;}
	#spot.salon .main ul li .text_box .flex{display: flex; padding: 0 0 5px;}
	#spot.salon .main ul li .text_box{ width: 100%;}
	#spot.salon .main ul li .text_box .flex .text_2{width: 62%;}
	#spot.salon .main ul li .text_box h3{font-size: 11px; padding:0px;}
	#spot.salon .main ul li .text_box h3 span{ font-size: 16px;}
	#spot.salon .main ul li .text_box p{line-height: 140%;}
	
	#spot.salon .main ul li .text_box p.adress{font-size: 12px;padding: 5px 0 0;}
	#spot.salon .main ul li .text_box p.tel{padding: 10px 0 0;font-size: 13px;}
	#spot.salon .main ul li .text_box a.link{font-size: 13px; line-height: 140%;}
	#spot.salon .main ul li .text_box p.text{padding: 10px 0 5px;font-size: 12px;}
	
	#spot.salon .main ul li .text_box a{ font-size: 14px;}
	#spot.salon .main ul li .flex_box{ margin: 10px 0 0;}
	#spot.salon .main ul li .flex_box p{font-size: 13px;}
	#spot.salon .main ul li .flex_box table{width: 100%;}
	#spot.salon .main ul li .flex_box table tr{width: 100%; display: block;}
	#spot.salon .main ul li .flex_box table tr th{ width: 100%; display: block; text-align: center; border-bottom: 1px solid #000; border-right: none;}
	#spot.salon .main ul li .flex_box table tr td{ width: 100%;display: block; text-align: center;}
	#spot.salon .main ul li .flex_box p.coupon{padding: 6px 0px; }
	#spot.salon .main ul li .flex_box p.cut{padding: 6px 15px; display: inline-block; text-align: left;}
	#spot.salon .main ul li .flex_box p span.new{font-size: 11px; padding: 3px; margin: 0 10px 0 0;}
	
	
	
	#spot.salon .main ul li .text_box p.adress span.tt_link_box{display: block;line-height: 140%;}
	#spot.salon .main ul li .text_box a.link_box{font-size: 12px;margin: 0 0 5px;}

}









