@charset "UTF-8";

/* ==================================================
contents
================================================== */
#main h1 {
	color:#000E57;
	border:3px solid #000E57;
	background:url(../images/main/h1_bg.gif) repeat-x left bottom;
	padding:20px 20px 24px;
	font-size:171.4%;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	margin:0 0 30px;
	clear:both;
}
#main h2 {
	color:#000E57;
	border-bottom:3px solid #000E57;
	font-size:143%;
	margin:0 0 30px;
	clear:both;
}
#main p {
	margin:0 0 20px;
}
#main ul {
	list-style:none;
}
#main table {
	width:100%;
	border-collapse:collapse;
	border-spacing:0;
}
#main p img {
	vertical-align:middle;
	margin:0 3px;
}
/* toggle_btn
============================== */
.toggle_btn {
	font-size: 143%;
	display: block;
	margin: 0 auto;
	text-decoration: none;
	min-height: 30px;
	line-height: 30px;
	overflow: hidden;
	font-weight: bold;
	text-align: center;
	max-width: 120px;
	border: 1px solid #ccc;
	background-color: #f5f5f5 !important;
	color: #666 !important;
	box-shadow: 2px 2px 0 0 #eee;
}

.menu_tbl .icon .toggle_btn {
	max-width: 60px;
}

.toggle_btn:active {
	-ms-transform: translateY(2px);
	-webkit-transform: translateY(2px);
	transform: translateY(2px);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0.2);
	background-color: #BFEAF2 !important;
	border: 1px solid #44BFDA;
}

.toggle_btn img {
	vertical-align: middle;
}
/* box_msg
============================== */
#main .box_msg1,
#main .box_msg2,
#main .box_msg3,
#main .box_msg4 {
	font-size:130%;
	font-weight:bold;
	padding:50px 10px;
	text-align:center;
	margin:0 0 50px;
}
#main .box_msg1 {
	color:#333;
	background-color:#FFFFE6;
}
#main .box_msg2 {
	color:#360;
	background-color: #E0EFEF;
}
#main .box_msg3 {
	color:#C00;
	background-color:#FEF3FC;
}
#main .box_msg4 {
	color:#333;
	background-color:#E6F2FF;
}
/* msg_ico */
#main .msg_ico {
	display:inline-block;
}
#main .msg_ico p {
	display:inline-block;
	vertical-align:middle;
	margin:0 5px;
}
/* box_msg
============================== */
#main .wrap_box_msg {
	padding:10px;
	background-color:#FEF3F5;
	text-align:center;
	margin:0 0 50px;
}
#main .box_msg {
	border:2px solid #F8A7B5;
	padding:50px 10px 30px;
}
#main .box_msg p {
	font-size:150%;
}
/* col2
============================== */
#main .col2 {
	clear:both;
}
#main .col2L {
	width:49%;
	float:left;
}
#main .col2R {
	width:49%;
	float:right;
}
#main table .col2 p {
	display:table;
	width:50%;
	float:left;
}
#main table .col2 p label {
	display:table-cell;
	vertical-align:middle;
	width:3em;
	padding-right:10px;
	white-space:nowrap;
}
/* box_btn
============================== */
#contents .box_btn {
	text-align:center;
	background-color:#FEF3F5;
	padding:20px;
	margin:0 0 50px;
	clear:both;
}
#contents .error .box_btn {
	background-color:transparent;
}
#contents .box_btn p {
	min-width:300px;
	display:inline-block;
	vertical-align:top;
	margin:0 10px;
	font-size:143%;
	font-weight:bold;
}
#contents .box_btn p a {
	display:block;
	padding:10px;
	text-decoration:none;
	color:#fff;
    -webkit-transition: all .3s;
    transition: all .3s;
}
#contents .box_btn p span {
	display:inline-block;
	padding:4px 0 2px 40px;
	background-position:left center;
	background-repeat:no-repeat;
}
/* back */
#contents .box_btn .back a {
	background-color:#666;
	-webkit-box-shadow: 4px 4px 0 0 #e0e0e0;
	-moz-box-shadow: 4px 4px 0 0 #e0e0e0;
	box-shadow: 4px 4px 0 0 #e0e0e0;
}
#contents .box_btn .back a:hover {
	background-color:#444;
}
#contents .box_btn .back span {
	background-image:url(../images/icon/btn_icon_back.png);
}
/* next */
#contents .box_btn .next a {
	background-color: #339900;
	-webkit-box-shadow: 4px 4px 0 0 #D6EBCC;
	-moz-box-shadow: 4px 4px 0 0 #D6EBCC;
	box-shadow: 4px 4px 0 0 #D6EBCC;
}

	#contents .box_btn .next a:hover {
		background-color: #236A00;
	}

#contents .box_btn .next span {
	background-image: url(../images/icon/btn_icon_next.png);
	background-position: right center;
	padding: 2px 34px 0 0;
}
/* submit */
#contents .box_btn .submit a {
	background-color:#339900;
	-webkit-box-shadow: 4px 4px 0 0 #D6EBCC;
	-moz-box-shadow: 4px 4px 0 0 #D6EBCC;
	box-shadow: 4px 4px 0 0 #D6EBCC;
}
#contents .box_btn .submit a:hover {
	background-color:#236A00;
}
#contents .box_btn .submit span {
	background-image:url(../images/icon/btn_icon_submit.png);
}
/* gray */
#contents .gray {
    background-color:#6d6767;
    pointer-events: none; /* aタグのリンクを無効にする */
    cursor: default;  /* マウスオーバー時のカーソルをdefaultに固定 */
}
#contents .box_btn .gray span {
	background-image: url(../images/icon/btn_icon_next.png);
	background-position: right center;
	padding: 2px 34px 0 0;
}

/* ==================================================
modal
================================================== */
#modal-content {
	width: 50%;
	margin: 0;
	padding: 40px 20px;
	border: 4px solid #04A2DF;
	background: #fff;
	position: fixed;
	display: none;
	z-index: 4;
}

#modal-content-innar {
	text-align: center;
	margin: 0 auto;
	width: 80%;
}

#modal-overlay {
	z-index: 3;
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 120%;
	background-color: rgba( 0,0,0, 0.8 );
}

#modal-content .btn {
	margin-top: 40px;
}

	#modal-content .btn p {
		display: inline-block;
		vertical-align: top;
		margin: 0 5px;
		width: 40%;
		font-weight: bold;
	}

		#modal-content .btn p a {
			display: block;
			text-decoration: none;
			color: #fff;
			padding: 8px 5px;
		}

#modal-content .yes_btn a {
	background-color: #3B5998;
	-webkit-box-shadow: 4px 4px 0 0 #D8DEEA;
	-moz-box-shadow: 4px 4px 0 0 #D8DEEA;
	box-shadow: 4px 4px 0 0 #D8DEEA;
}

	#modal-content .yes_btn a:hover {
		background-color: #006C9E;
	}

#modal-content .no_btn a {
	background-color: #676767;
	-webkit-box-shadow: 4px 4px 0 0 #eee;
	-moz-box-shadow: 4px 4px 0 0 #eee;
	box-shadow: 4px 4px 0 0 #eee;
}

	#modal-content .no_btn a:hover {
		background-color: #888;
	}

#modal-content-innar.error {
	color: #C00;
	background-color: #FEF3FC;
}
/* stylist
============================== */
#stylist {
	letter-spacing:-.4em;
	clear:both;
}
#stylist .box_stylist {
	letter-spacing:normal;
	display:inline-block;
	vertical-align:top;
	width:20%;
	padding:0 10px 20px;
}
#stylist .box_stylist .inner.disable {
     filter:grayscale(100%);   
}
#stylist .box_stylist .inner .btn a.gray {
    background-color:#6d6767;  
    pointer-events: none; /* aタグのリンクを無効にする */
    cursor: default;  /* マウスオーバー時のカーソルをdefaultに固定 */
}
#stylist .box_stylist .inner {
	background-color:#fff;
	padding:15px 20px;
	-webkit-box-shadow: 0 1px 5px rgba(0,0,0,0.2);
	-moz-box-shadow: 0 1px 5px rgba(0,0,0,0.2);
	box-shadow: 0 1px 5px rgba(0,0,0,0.2);
}
#stylist .box_stylist .set_width_height {
    height: 216px;
    width: 100%;
    text-align: center;
    position: relative;
}
#stylist .box_stylist p {
	margin-bottom:5px;
	line-height:1.3;
}
#stylist .box_stylist p img {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
}
#stylist .box_stylist .rank {
	text-align:center;
	background-color:#F75625;
	color:#fff;
	font-weight:bold;
	font-size:85.7%;
	padding:4px 0;
    height:21.87px;
}
#stylist .box_stylist .name {
	line-height:1.2;
	font-size:185%;
	font-weight:bold;
	margin-bottom:0;
}
#stylist .box_stylist .kana {
	font-size:85.7%;
	padding-bottom:5px;
}
#stylist .box_stylist .text {
	padding:7px;
	background-color:#FFF6F1;
    font-size:85.7%;
    height:99px;
}
#stylist .box_stylist .btn {
	text-align:center;
	font-size:143%;
	font-weight:bold;
}
#stylist .box_stylist .btn a {
	min-width: inherit;
	display:block;
	text-decoration:none;
	padding:5px;
	background-color: #306;
	color:#fff;
	position:relative;
}
#stylist .box_stylist .btn a:hover {
	-webkit-box-shadow: 0 1px 5px rgba(0,0,0,0.3);
	-moz-box-shadow: 0 1px 5px rgba(0,0,0,0.3);
	box-shadow: 0 1px 5px rgba(0,0,0,0.3);
}
#stylist .box_stylist .btn a::after {
	content:"";
	position:absolute;
	right:10px;
	top:50%;
	margin-top:-6px;
    width:12px;
    height:12px;
	background:url(../images/icon/arrow_w.png) no-repeat;
}
#stylist .box_stylist .btn a:hover {
	background-color:#303;
}
/* 指名なし */
#stylist .box_stylist.appoint .rank {
	background-color:#fff;
}
#stylist .box_stylist.appoint .btn a {
	background-color:#F36;
}
#stylist .box_stylist.appoint .btn a:hover {
	background-color: #DB006D;
}
@media screen and (max-width : 1280px) and (min-width: 1025px) {
	#stylist .box_stylist .name {
		font-size:130%;
	}
	#stylist .box_stylist .rank,
	#stylist .box_stylist .kana {
		font-size:71.4%;
	}
	#stylist .box_stylist .btn {
		font-size:100%;
	}
    #stylist .box_stylist p img {
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        margin: auto;
    }
    #stylist .box_stylist .set_width_height {
        height: 216px;
        text-align: center;
        position: relative;
    }
}
@media screen and (max-width : 1024px) and (min-width: 769px) {
	#stylist .box_stylist {
		width:25%;
	}
	#stylist .box_stylist .name {
		font-size:114.3%;
	}
	#stylist .box_stylist .rank,
	#stylist .box_stylist .kana {
		font-size:71.4%;
	}
	#stylist .box_stylist .text {
		font-size:71.4%;
	}
	#stylist .box_stylist .btn {
		font-size:100%;
	}
    #stylist .box_stylist p img {
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        margin: auto;
    }
    #stylist .box_stylist .set_width_height {
        height: 216px;
        text-align: center;
        position: relative;
    }
}
/* 日付選択
============================== */
#main .holiday_icon {
	display:inline-block;
	vertical-align:middle;
	margin:0 5px;
	width:40px;
	height:1em;
	background-color:#f5f5f5;
	border:1px solid #ccc;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
#main .hold_icon {
	display:inline-block;
	vertical-align:middle;
	margin:0 2px;
	line-height:1;
	font-size:130%;
	color:#CC0000;
}
/* input
============================== */
#main table input[type='text'],
#main table input[type='tel'],
#main table input[type='email'],
#main table input[type='password'],
#main table textarea {
	width:90%;
	padding:5px;
	-webkit-transition: .2s ease-in-out;
	transition: .2s ease-in-out;
	letter-spacing: 1px;
	color: #333;
	border: 1px solid #ccc;
	box-shadow: 1px 1px 5px 0 rgba(204,204,204, .5) inset;
}
#main table input[type='tel'],
#main table input[type='email'] {
	width:50%;
}
/*#main table input[type='password'] {
	width:15em;
}*/

#main table input.in_10 {
	width:10em;
}
#main table input.in_20 {
	width:20em;
}
#main table input[type='text']:focus,
#main table input[type='tel']:focus,
#main table input[type='email']:focus,
#main table input[type='password']:focus,
#main table textarea:focus {
	border: 1px solid #333;
	outline: none;
	box-shadow: 0 0 5px 1px rgba(204,204,204, .5);
}
/* error用 */
#main table input[type='text'].in_error,
#main table input[type='tel'].in_error,
#main table input[type='email'].in_error,
#main table input[type='password'].in_error {
	border-color:#da3c41;
	background-color:#FFF0F0;
}
#main table input[type='text'].in_error:focus,
#main table input[type='tel'].in_error:focus,
#main table input[type='email'].in_error:focus,
#main table input[type='password'].in_error:focus {
	box-shadow: 0 0 5px 1px rgba(218,60,65, .5);
}
/* menu_table
============================== */
#main #menu_table {
	margin:0 auto 50px;
}
#main #menu_table table {
	border-top:1px dotted #000D57;
}
#main #menu_table table td {
	padding:12px 10px;
	vertical-align:middle;
	border-bottom:1px dotted #000D57;
}
/*メニューのすべての行の背景色を白に設定*/
/*#main #menu_table table tr:nth-child(odd) td {
	background-color:#FFFEF0;
}*/
#main #menu_table table .select {
	width:20px;
	text-align:center;
	white-space:nowrap;
}
#main #menu_table table .time {
	width:60px;
	text-align:center;
	white-space:nowrap;
}
#main #menu_table table .list {
	width:auto;
	font-size:114.3%;
	font-weight:bold;
}
#main #menu_table table .price {
	width:100px;
	text-align:right;
	white-space:nowrap;
}
#main #menu_table .tr_disable td {
	background-color:#eee !important;
}
/* cal_table
============================== */
#main #cal_table {
	/* 2020/12/24 課題表 No.25 対応 */
	/* margin:0 0 50px; */
	margin: 0 0 10px;
}
#main #cal_table table {
	border-bottom:1px solid #ccc;
	border-right:1px solid #ccc;
}
#main #cal_table table p {
	margin-bottom:0;
}
#main #cal_table table th {
	line-height:1.1;
	font-size:85.7%;
}
#main #cal_table table th,
#main #cal_table table td {
	width:70px;
	text-align:center;
	vertical-align:middle;
	border-top:1px solid #ccc;
	border-left:1px solid #ccc;
}
#main #cal_table table td {
	height:35px;
}
#main #cal_table table td p {
	height:100%;
}
#main #cal_table table tr:nth-child(odd) td {
	border-top-width:2px;
}
#main #cal_table table .time {
	width:88px;
	padding-top:0.4em;
	background-color:#f5f5f5;
}
#main #cal_table table td.time {
	font-size:107%;
}
#main #cal_table table td.timeL {
	text-align:right;
	padding-right:20px;
}
#main #cal_table table td.timeR {
	text-align:left;
	padding-left:20px;
}
#main #cal_table table td.time.half {
	font-size:93%;
	padding-top:0.5em;
	padding-bottom:0.2em;
}
#main #cal_table table .sat {
	background-color:#E1F9FF;
	color:#0066CC;
}
#main #cal_table table .sun {
	background-color:#FFEEEE;
	color:#CC0000;
}
#main #cal_table table .close {
	background-color:#f5f5f5;
}
#main #cal_table .prev a {
	color:#333;
	display:inline-block;
	text-decoration:none;
	padding:2px 0 0 20px;
	background:url(../images/icon/cal_back.png) no-repeat left center;
}
#main #cal_table .next a {
	color:#333;
	display:inline-block;
	text-decoration:none;
	padding:2px 20px 0 0;
	background:url(../images/icon/cal_next.png) no-repeat right center;
}
#main #cal_table .prev a:hover,
#main #cal_table .next a:hover {
	text-decoration:underline;
}
/* open_ico */
#main #cal_table table .open_ico {
	height: 100%;
	overflow: hidden;
	position: relative;
	width: auto;
}
#main #cal_table table .open_ico:hover {
	background-color: #FFEEEE;
	text-decoration: none;
}
#main #cal_table table span.open_ico:hover {
	background-color: #FFFFFF;
}
#main #cal_table table .open_ico::before,
#main #cal_table table .open_ico::after {
	border: 1px solid #CC0000;
	border-radius: 100px;
	content: "";
	left: 0;
	margin: auto;
	position: absolute;
	right: 0;
}
#main #cal_table table .open_ico::before {
	height: 14px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 14px;
}
#main #cal_table table .open_ico::after {
	height: 8px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 8px;
}

/* close_ico */
#main #cal_table table .close_ico {
	background-color:#f5f5f5;
	overflow: hidden;
	position: relative;
	width: auto;
}
#main #cal_table table .close_ico::before,
#main #cal_table table .close_ico::after {
	background: #333333;
	content: "";
	height: 1px;
	left: 0;
	margin: auto;
	position: absolute;
	right: 0;
	top: 16px;
	width: 10px;
}
#main #cal_table table .close_ico::before {
	top: 50%;
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
#main #cal_table table .close_ico::after {
	top: 50%;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

/* outside_ico */
#main #cal_table table .outside_ico {
	background-color:#f5f5f5;
	overflow: hidden;
	position: relative;
	width: auto;
}
#main #cal_table table .outside_ico::before,
#main #cal_table table .outside_ico::after {
	background: #333333;
	content: "";
	height: 1px;
	left: 0;
	margin: auto;
	position: absolute;
	right: 0;
	top: 16px;
	width: 10px;
}
#main #cal_table table .outside_ico::before {
	top: 50%;
}
#main #cal_table table .outside_ico::after {
	top: 50%;
}

/* line_tbl
============================== */
#main .line_tbl {
	border-top:1px solid #ccc;
	border-right:1px solid #ccc;
	margin:0 0 50px;
}
#main .line_tbl caption {
	color:#000E57;
	text-align:left;
	font-size:128.6%;
	font-weight:bold;
	line-height:1.1;
	border-left:5px solid #000E57;
	padding-left:10px;
	margin-bottom:10px;
}
#main .line_tbl th,
#main .line_tbl td {
	border-left:1px solid #ccc;
	border-bottom:1px solid #ccc;
	text-align:left;
	vertical-align:middle;
	padding:15px 15px 5px 15px;
}
#main .line_tbl th {
	width:200px;
	background-color:#f5f5f5;
	color:#333;
}
#main .line_tbl th p,
#main .line_tbl td p {
	margin-bottom:10px;
}
#main .line_tbl th .must {
	position:relative;
	padding-right:1.2em;
}
#main .line_tbl th .must::after {
	content:"※";
	position:absolute;
	top:50%;
	right:0;
	margin-top:-0.8em;
	margin-bottom:0;
	color:#C00;
	font-weight:bold;
}
#main .must_icon {
	color:#C00;
	font-weight:bold;
}
#main .line_tbl td.col p.pref {
	width: 8em;
	margin-right: 1.0rem
}

#main .line_tbl td.col p.add_sch {
	width: 6em;
}

#main .line_tbl td.col p.pref .toggle_btn,
#main .line_tbl td.col p.add_sch .toggle_btn {
	font-size: 100%;
	line-height: 35px;
	height: 35px;
}

#main .line_tbl td.col p.add_sch .toggle_btn {
	border-color: #060;
	background-color: #669900 !important;
	color: #fff !important;
}

#main .line_tbl td.col p.add_sch .toggle_btn:active {
	background-color: #393 !important;
}
/* ==================================================
予約ボタン
================================================== */
.reserve_button {
	font-size: 68.7%;
	font-weight: bold;
	padding: 2px 10px;
	border: 2px solid #336633;
	color: #336633;
	background-color: #fff;
	position: relative;
	display: inline-block;
}
/* ==================================================
キャンセルボタン
================================================== */
.cancel_button {
	font-size: 68.7%;
	font-weight: bold;
	padding: 2px 10px;
	border: 2px solid #F75625;
	color: #F75625;
	background-color: #fff;
	position: relative;
	display: inline-block;
}
/* ==================================================
会員コース情報
================================================== */
#main .member_course_tbl {
	border: 1px solid #ccc;
	margin: 0 0 0;
}

	#main .member_course_tbl p {
		margin: 0;
	}

	#main .member_course_tbl th,
	#main .member_course_tbl td {
		border: 1px solid #ccc;
		padding: 7px 5px;
		line-height: 1.2;
		font-size: 85.7%;
		vertical-align: middle;
		text-align: center;
	}

	#main .member_course_tbl th {
		background-color: #f5f5f5;
	}

	#main .member_course_tbl td {
		padding: 7px 5px;
	}

	#main .member_course_tbl th.price {
		width: 15%;
	}

	#main .member_course_tbl td.select {
		width: 3%;
	}

		#main .member_course_tbl td.select input:hover {
			cursor: pointer;
		}

	#main .line_tbl td.select {
		width: 3%;
		padding: 15px 15px 15px 15px;
	}

		#main .line_tbl td.select input:hover {
			cursor: pointer;
		}

td label {
	cursor: pointer;
}

#main .member_course_tbl td.name {
	width: 82%;
	text-align: left;
}

#main .member_course_tbl th p {
	display: inline-block;
	vertical-align: middle;
	position: relative;
}
/* ==================================================
店舗コース情報
================================================== */
#main .course_tbl {
	border: 1px solid #ccc;
	margin: 0 0 15px 0;
}

#main .course_tbl p {
	margin: 0;
}

#main .course_tbl th,
#main .course_tbl td {
	border: 1px solid #ccc;
	padding: 7px 5px;
	line-height: 1.2;
	font-size: 85.7%;
	vertical-align: middle;
	text-align: center;
}

#main .course_tbl th {
	background-color: #f5f5f5;
}

#main .course_tbl td {
	padding: 7px 5px;
}

#main .course_tbl .name {
	width: 80%;
}

#main .course_tbl .service {
	width: 60%;
}

#main .course_tbl .price,
#main .course_tbl .single,
#main .course_tbl .monthly {
	width: 20%;
}

#main .course_tbl th p {
	display: inline-block;
	vertical-align: middle;
	position: relative;
}

#main .course_tbl td.name,
#main .course_tbl td.service {
	text-align: left;
}
/* inline-radio
============================== */
#main .inline-radio li {
	width:30px;
	display:inline-block;
	vertical-align:top;
	margin:0 10px 10px 0;
	text-align:center;
	position: relative;
}
#main .inline-radio li input {
    width: 100%;
    height: 30px;
    opacity: 0;
	cursor:pointer;
	position:relative;
}
#main .inline-radio li label {
	font-weight:bold;
	position: absolute;
	top: 0;
	left: 0;
	color: #fff;
	width: 100%;
	height: 100%;
	background:#44BFDA;
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
	-webkit-box-shadow: 2px 2px 0 0 #0079B5;
	-moz-box-shadow: 2px 2px 0 0 #0079B5;
	box-shadow: 2px 2px 0 0 #0079B5;
}
#main .inline-radio li input:checked + label {
	background-color:#015BA9;
	box-shadow:none;
	-webkit-box-shadow:inset 0 0 8px 0 #003366;
	-moz-box-shadow:inset 0 0 8px 0 #003366;
	box-shadow:inset 0 0 8px 0 #003366;
}
/* 性別用 */
#main .inline-radio.gender li {
	width:100px;
}
#main .inline-radio li.gender_man label {
	border:2px solid #0079B5;
	background-color:#fff;
	color:#0079B5;
	-webkit-box-shadow: 2px 2px 0 0 #D5EAFF;
	-moz-box-shadow: 2px 2px 0 0 #D5EAFF;
	box-shadow: 2px 2px 0 0 #D5EAFF;
}
#main .inline-radio li.gender_man input:checked + label {
	background-color:#0069D2;
	color:#fff;
	background-image:url(../images/icon/checked.png) !important;
	background-repeat:no-repeat !important;
	background-position:10px center !important;
}
#main .inline-radio li.gender_woman label {
	border:2px solid #FF6699;
	background-color:#fff;
	color:#FF6699;
	-webkit-box-shadow: 2px 2px 0 0 #FFD0DF;
	-moz-box-shadow: 2px 2px 0 0 #FFD0DF;
	box-shadow: 2px 2px 0 0 #FFD0DF;
}
#main .inline-radio li.gender_woman input:checked + label {
	background-color:#D00068;
	color:#fff;
	-webkit-box-shadow:inset 0 0 8px 0 #66001A;
	-moz-box-shadow:inset 0 0 8px 0 #66001A;
	box-shadow:inset 0 0 8px 0 #66001A;
	background-image:url(../images/icon/checked.png) !important;
	background-repeat:no-repeat !important;
	background-position:10px center !important;
}
/* ==================================================
progress_bar
================================================== */
.progress_bar {
	margin:0 0 50px;
}
.progress_bar ol {
	display: flex;
	justify-content: space-between;
	list-style: none;
	padding: 0;
}
.progress_bar li {
	flex: 2;
	position: relative;
	padding: 0 0 14px 0;
	line-height: 1.5;
	color:#333;
	font-weight: bold;
	white-space: nowrap;
	overflow: visible;
	min-width: 0;
	text-align: center;
	border-bottom: 4px solid #e8e8e8;
}
.progress_bar li:first-child,
.progress_bar li:last-child {
	flex: 1;
}
.progress_bar li:first-child {
	text-align:left;
}
.progress_bar li:last-child {
	text-align: right;
}
.progress_bar li:before {
	content: "";
	display: block;
	width:16px;
	height:16px;
	background-color:#e8e8e8;
	border-radius: 50%;
	border: 4px solid #fff;
	position: absolute;
	left: calc(50% - 7px);
	bottom: -9px;
	z-index: 3;
	transition: all .2s ease-in-out;
}
.progress_bar li:first-child::before {
	left: 0;
}
.progress_bar li:last-child::before {
	right: 0;
	left: auto;
}
.progress_bar span {
	transition: opacity .3s ease-in-out;
}
.progress_bar li:not(.is-active) span {
	opacity: .3;
	font-weight:normal;
}
.progress_bar .is-complete span {
	opacity: .7 !important;
}
.progress_bar .is-complete:not(:first-child)::after,
.progress_bar .is-active:not(:first-child)::after {
	content: "";
	display: block;
	width: 100%;
	position: absolute;
	bottom: -2px;
	left: -50%;
	z-index: 2;
	border-bottom: 4px solid #F75625;
}
.progress_bar li:last-child span {
	width: 200%;
	display: inline-block;
	position: absolute;
	left: -100%;
}
.progress_bar .is-complete:last-child::after,
.progress_bar .is-active:last-child::after {
	width: 200%;
	left: -100%;
}
.progress_bar .is-complete:before {
	background-color:#F75625;
}
.progress_bar .is-active::before,
.progress_bar .is-hovered::before {
	background-color:#fff;
	border-color:#F75625;
}
.progress_bar .is-hovered::before {
	transform: scale(1.33);
}
/* ==================================================
clearfix
================================================== */
#main .col2:after,
#stylist:after {
	content: ""; 
	display: table;
	clear: both;
}



#date_set_c {
	letter-spacing: normal;
	margin: 0 0 10px;
	clear: both;
	position: relative;
}

	#date_set_c .date {
		display: inline-block;
		vertical-align: middle;
		font-weight: bold;
	}

		#date_set_c .date p {
			display: inline-block;
			vertical-align: middle;
			margin: 0 3px;
		}

			#date_set_c .date p span {
				display: inline-block;
				vertical-align: baseline;
				padding: 0 10px;
				font-size: 200%;
			}

			#date_set_c .date p.year {
				padding: 0 10px;
			}

		#date_set_c .date a {
			border: 1px solid #ccc;
			display: inline-block;
			color: #333;
			padding: 8px 40px 6px 20px;
			line-height: 0.8;
			-webkit-transition: .2s ease-in-out;
			transition: .2s ease-in-out;
			-webkit-border-radius: 3px;
			-moz-border-radius: 3px;
			border-radius: 3px;
			position: relative;
		}

			#date_set_c .date a::after {
				content: "";
				position: absolute;
				top: 50%;
				right: 10px;
				margin-top: -3px;
				width: 0;
				height: 0;
				border-style: solid;
				border-width: 6px 4px 0 4px;
				border-color: #ccc transparent transparent transparent;
			}

			#date_set_c .date a:hover {
				border-color: #015BA9;
			}

				#date_set_c .date a:hover::after {
					border-color: #015BA9 transparent transparent transparent;
				}


	#date_set_c .nav_back,
	#date_set_c .nav_next {
		display: inline-block;
		vertical-align: middle;
		margin: 0 3px;
	}

	#date_set_c .nav_next {
		margin-right: 20px;
	}

		#date_set_c .nav_back a,
		#date_set_c .nav_next a {
			position: relative;
			background-color: #015BA9;
			color: #fff;
			padding: 7px 10px;
			-webkit-transition: .2s ease-in-out;
			transition: .2s ease-in-out;
		}

			#date_set_c .nav_back a:hover,
			#date_set_c .nav_next a:hover {
				background-color: #1B95E0;
			}

		#date_set_c .nav_back span,
		#date_set_c .nav_next span {
			width: 18px;
			height: 18px;
			text-indent: 100%;
			white-space: nowrap;
			overflow: hidden;
			display: inline-block;
		}

		#date_set_c .nav_back a::before,
		#date_set_c .nav_next a::before {
			content: "";
			position: absolute;
			left: 50%;
			top: 50%;
			width: 16px;
			height: 16px;
			margin-top: -8px;
			margin-left: -8px;
		}

		#date_set_c .nav_next a::before {
			background: url(../images/icon/next_icon.png) no-repeat;
		}

	#date_set_c .nav_back a::before {
		background: url(../images/icon/back_icon.png) no-repeat;
	}

/* in_btn
============================== */
	#date_set_c .in_btn a:hover {
		box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5) !important;
	}