/*　=========================================================
　　最低限のリセット
============================================================*/
html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
dl,
dd,
dt,
ol{
     margin: 0;
     padding: 0;
 }
 ul {
     list-style: none;
 }
 ul, dl, ol{
 	list-style-position: inside;
 }
 a {
 	color: inherit;
 	text-decoration: none;
 }
img{
	height: auto;
	max-width: 100%;
	width: 100%;
}

/*　=========================================================
　　全体
============================================================*/
body{
	background: #eee;
	box-sizing: border-box;
	color: #242424;
	font-family: 'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,sans-serif;
	font-size: 16.5px;
	line-height: 1.9;
}

/* 装飾
---------------------------------------*/
/* 大見出し */
.ttl_bar{
    background: transparent;
    border-left: solid 5px #242424;
	margin-bottom: 30px;
	padding: 0.25em 0.5em;
}
/* 小見出し */
.ttl_sub{
	background: #242424;
	color: #fff;
	font-size: 110%;
	margin-bottom: 20px;
	padding: 10px;
}

/* 文字色 */
.c_red{
	color: #EF1D1D;
	font-size: 85%;
}.c_gray{
	color: #989898;
	font-size: 80%;
}

/* ボタン、リンク系 */
div.set_right {
	text-align: right;
}
.a_link_right {
	font-size: 90%;
	text-align: right;
}
.a_link_right p{
	border-bottom: 1px solid #242424;
	display: inline-block;
}

.a_link_line_blue {
	color: #2f5597;
	text-decoration: underline!important;
	font-weight: bold;
}

/* 必須タグ */
.tag{
	background: #242424;
	color: #fff;
	font-size: 80%;
	display: inline-block;
	padding: 2.5px 12px;
}

/* ラジオボタン */
input.btn_radio {
  position: absolute;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
label {
  position: relative;
  padding-left: 25px;
  font-size: 90%;
  cursor: pointer;
}
label:before {
  content: "";
  position: absolute;
  top: 1px;
  left: 0;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: solid 2px #ccc;
  transition: all cubic-bezier(0.215, 0.61, 0.355, 1) 0.15s;
}
input.btn_radio:checked + label:before,
input.btn_radio:focus + label:before{
	border-color: #f1bc48;
}
label:after {
  content: '';
  position: absolute;
  top: 5px;
  left: 4px;
  width: 12px;
  height: 12px;
  background-color: #f1bc48;
  border-radius: 50%;
  color: transparent;
  transform: scale(0);
  transition:
    transform cubic-bezier(0.215, 0.61, 0.355, 1) 0.15s,
    color cubic-bezier(0.215, 0.61, 0.355, 1) 0.15s;
}
input.btn_radio:checked + label:after {
  transform: scale(1);
}

/* お問い合わせ内容 */
textarea.inquiry{
	box-sizing: border-box;
	min-height: 150px;
	padding: 10px;
	width: 100%;
}
textarea.inquiry:focus{
	border: 2px solid #f1bc48;
    z-index: 10;
    outline: 0;
}

/* 来店日,来店時間 */
input.days, input.time{
	margin-left: 5px;
	padding: 5px 10px;
}

/* セレクトボックス */
.box_select {
	overflow: hidden;
	text-align: center;
}
.box_select select {
	width: 100%;
	padding-right: 1em;
	cursor: pointer;
	text-indent: 0.01px;
	text-overflow: ellipsis;
	border: 1px solid #767676;
	outline: none;
	background: transparent;
	background-image: none;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
}
.box_select select::-ms-expand {
    display: none;
}
.box_select.select_01 {
	position: relative;
	border-radius: 2px;
}
.box_select.select_01::before {
	position: absolute;
	top: 45%;
    right: 2%;
	width: 0;
	height: 0;
	padding: 0;
	content: '';
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid #666666;
	pointer-events: none;
}
.box_select select {
	font-size: 80%;
	padding: 15px 38px 15px 8px;
}
select:focus{
	border: 2px solid #f1bc48;
    z-index: 10;
    outline: 0;
}

/* テキストボックス_横並び_4つ */
.li_text{
	align-items: center;
	display: flex;
	justify-content: space-between;
	width: 100%;
}
.li_text .item{
	/*border: 1px solid #767676;*/
    border-radius: 3px;
	/*height: 5.5vh;*/
	position: relative;
	width: 20%;
}
.li_text .item::after{
	content: "-";
	position: absolute;
    top: 0;
    right: -18%;
}
.li_text .item:last-child::after{
	content: "";
}
.li_text form{
	width: auto;
}
.li_text input[type="text" i] {
	padding: 10px 5px;
	text-align: center;
	width: 90%;
}
.li_text input {
	padding: 10px 5px;
	text-align: center;
	width: 90%;
}

.li_text2{
	display: flex;
	justify-content: space-between;
}
.li_text2 li{
	width: 49%;
}
.li_text2 input[type="text" i] {
	padding: 10px 5px;
	text-align: left;
	width: 90%;
}
.li_text2 input{
	padding: 10px 5px;
	text-align: left;
	width: 90%;
}
.li_text2 strong{
	display: block;
}

/* email */
input[type="tel" i], input[type="email" i] {
	padding: 10px 5px;
	width: 95%;
}

input.tel_text,
input.mail_text {
	padding: 10px 5px;
	width: 95%;
}

input.calendar_text {
	padding: 10px 5px;
}

/* チェックボックス */
input[type=checkbox] {
	display: none;
}
.checkbox02 {
    box-sizing: border-box;
    cursor: pointer;
    display: inline-block;
    padding: 5px 30px;
    position: relative;
    width: auto;
}
.checkbox02::before {
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 3px;
    content: '';
    display: block;
    height: 16px;
    left: 5px;
    margin-top: -8px;
    position: absolute;
    top: 50%;
    width: 16px;
}
.checkbox02::after {
	background-color: transparent;
    border-radius: 0;
    border-right: 6px solid #00cccc;
    border-bottom: 3px solid #00cccc;
    content: '';
    display: block;
    height: 20px;
    left: 7px;
    margin-top: -16px;
    opacity: 0;
    position: absolute;
    top: 50%;
    transform: rotate(45deg);
    width: 9px;
}
input[type=checkbox]:checked + .checkbox02::before {
    border-color: #666;
}
input[type=checkbox]:checked + .checkbox02::after {
    opacity: 1;
}

/*　========================================================
　　PC
============================================================*/
article{
	background: #fff;
	margin: 0 auto;
	max-width: 1200px;
	min-height: 100vh;
	padding: 50px 25px;
}
article .box{
	margin-bottom: 30px;
}
article .box_2{
	border-top: 1px solid #D5D5D5;
	border-left: 1px solid #D5D5D5;
	border-right: 1px solid #D5D5D5;
}

/* header
---------------------------------------*/
header{
	margin-bottom: 50px;
}

/* コンテンツ
---------------------------------------*/
section {
	margin-bottom: 100px;
}
section:last-of-type{
	margin-bottom: 0;
}

section .li_qa{
	display: flex;
	justify-content: space-between;
}
section .li_qa .item_q{
	background: #eee;
	border-right: 1px solid #D5D5D5;
	width: 30%;
}
section .li_qa .item_q h3{
	font-size: 100%;
}
section .li_qa .item_a{
	width: 70%;
	word-break: break-all;
}
section .li_qa .item_q, section .li_qa .item_a{
	border-bottom: 1px solid #D5D5D5;
	padding: 15px;
}

/* お問い合わせ内容 */
#cont_01{}

/* お客様情報 */
#cont_02{}

/* 確認項目 */
#cont_03{}
#cont_03 p{
	margin-bottom: 20px;
	text-align: center;
}
#cont_03 .box_cbtn{
	cursor: pointer;
	margin-bottom: 35px;
	text-align: center;
}
#cont_03 .box_btn_top,
#cont_03 .box_btn_confirm{
	cursor: pointer;
	margin-bottom: 20px;
}
#cont_03 .box_btn_top a{
	cursor: pointer;
	background: #000;
	color: #fff;
	display: block;
	margin: 0 auto;
	padding: 10px;
	text-align: center;
	width: 70%;
}
#cont_03 .box_btn_finish{
	cursor: pointer;
	margin-bottom: 20px;
	display: none;
}
#cont_03 .box_btn_finish a{
	cursor: pointer;
	background: #000;
	color: #fff;
	display: block;
	margin: 0 auto;
	padding: 10px;
	text-align: center;
	width: 70%;
}
#cont_03 .box_btn_return{
	cursor: pointer;
	margin-bottom: 30px;
}
#cont_03 .box_btn_return a{
	cursor: pointer;
	background: #a5a5a5;
	color: #fff;
	display: block;
	margin: 0 auto;
	padding: 10px;
	text-align: center;
	width: 70%;
}
#cont_03 .box_btn_top a,
#cont_03 .box_btn_finish a,
#cont_03 .box_btn_return a{
	cursor: pointer;
	margin-bottom: 10px;
}

/* 注意文言 */
#cont_03 .box_notes{
}
#cont_03 .box_notes span{
	font-size: 100%;
}
.footer{
	border: none;
	text-align: center;
}
#error_exception{
	border: 1px solid #EF1D1D;
	padding: 15px;
	display: block;
	margin: 0 auto;
	margin-bottom: 20px;
	text-align: center;
}
#cont_03 .box_btn_confirm button:hover,
#cont_03 .box_btn_finish button:hover,
#cont_03 .box_btn_return button:hover {
	cursor: pointer;
	opacity:0.7;
	}
#cont_03 .box_btn_confirm button:active,
#cont_03 .box_btn_finish button:active,
#cont_03 .box_btn_return button:active {
	cursor: pointer;
	-webkit-transform: translate(0,1px);
	-moz-transform: translate(0,1px);
	transform: translate(0,1px);
	border-bottom:none;
}

/*　========================================================
　　768px以下
============================================================*/
@media screen and (max-width: 768px) {
	/* コンテンツ
    ---------------------------------------*/
    section {
        margin-bottom: 65px;
    }
	section:last-of-type{
		margin-bottom: 0;
	}
    section .li_qa{
		display: block;
    }
	section .li_qa .item_q{
		border-right: none;
	}
	section .li_qa .item_q, section .li_qa .item_a{
		padding: 10px 15px 15px;
        width: auto;
    }

	/* 確認項目 */
	#cont_03 p{
		text-align: left;
	}

	#modalLoading{
		border:2px solid #000000;
		padding:15px;
		position: fixed;
		top:40%;
		left:43%;
		background-color:#fff;
		filter: alpha(opacity=85);
		-moz-opacity:0.85;
		opacity:0.85;
	}

	#modalLoading .loadingMsg{
		text-align:center;
		padding-top:150px;
		width:150px;
		background-image:url(/img/loading.gif);
		background-position: center center;
		background-repeat: no-repeat;
		font-family: "メイリオ"!important;
	}
}


/*　========================================================
　　580px以下
============================================================*/
@media screen and (max-width: 580px) {
	article{
		padding: 15px 10px;
	}
}


/*　========================================================
　　768px以下
============================================================*/
@media screen and (max-width: 768px) {
	body{
        font-size: 14.5px;
    }
}


/*　========================================================
　　580px以下
============================================================*/
@media screen and (max-width: 580px) {
	.ttl_bar{
		margin-bottom: 15px;
	}

	/* テキストボックス_横並び_4つ */
    .li_text{
		flex-wrap: wrap;
		justify-content: space-around;
    }
    .li_text .item{
		margin-bottom: 10px;
        width: 43%;
    }
    .li_text .item::after{
        right: -7%;
    }

	.li_text2{
		display: block;
    }
    .li_text2 li{
		margin-bottom: 5px;
        width: 100%;
    }
	.li_text2 input[type="text" i]{
		width: 95.5%;
	}
}


/*　========================================================
　　400px以下
============================================================*/
@media screen and (max-width: 400px) {
	.li_text .item{
		width: 98%;
	}
	.li_text .item::after {
        right: 0%;
    }
}


/*　========================================================
　　追加
============================================================*/
.li_time{
	display: inline-block;
}
.time{
	padding: 15px 38px 15px 8px;
}
@media screen and (max-width: 565px) {
	.li_time{
		margin: 2.5px auto;
	}
	.time{
		padding: 10px 0px 10px 8px;
	}
}
@media screen and (max-width: 380px) {
	.time{
		margin-right: 2.5px;
		width: 90%;
	}
	.time:first-of-type{
		margin-bottom: 10px;
	}
}

.box_btn_top a,
button{
	background: #000;
	border: none;
    color: #fff;
    display: block;
	font-size: 98.5%;
	font-weight: bold;
    margin: 0 auto;
    padding: 13.5px 10px;
    text-align: center;
    width: 71.5%;
}
.box_btn_return button{
	background: #a1a1a1;
	border: none;
    color: #fff;
    display: block;
	font-size: 98.5%;
	font-weight: bold;
    margin: 0 auto;
    padding: 13.5px 10px;
    text-align: center;
    width: 71.5%;
}