.login_area { padding: 40px; height: 100%; }
.login_area > div.login_title { margin-top: 20px; position: relative; padding-left: 10px; }

.login_input_area { margin-top: 50px; }
.login_input_area > form > div { margin-top: 13px; }
.login_input_area > form > div.login_store_select_area { margin-top: 28px; }
.login_input_area > form > div.login_input_etc { margin-top: 26px; }

.login_input_area input[type="text"], .login_input_area input[type="number"], .login_input_area input[type="password"] {
	border: none; background: none; height: 33px; padding: 0px 5px; color: #fff; border-bottom: 1px solid #1b1b1b;
	width: 100%; font-size: 14px;
}

.search_area01 { margin-top: 5px; }
.search_area01 input[type="text"] {
	background-image: url('../images/search_icon.png');
	background-repeat: no-repeat;
	background-position: left 15px center;
	background-size: 16px;
	background-color: #f8f8f8;
	border-radius: 20px;
	height: 36px; padding: 0px 15px 0px 40px;
	border: none; width: 100%;
	font-size: 14px;
}

.agree_area01 {}
.agree_area01 > form > div:nth-child(2) {
	margin-top: 48px; border-bottom: 1px solid #f7f7f7; padding-bottom: 5px; margin-bottom: 15px;
}
.agree_area01 > form > div:nth-child(2) > p { line-height: 36px; position: relative; font-size: 14px; }
.agree_area01 > form > div:nth-child(2) > p > a { 
	position: absolute; right: 0px; display: inline-block; width: 36px; height: 36px; line-height: 36px; 
	background-image: url('../images/arrow_right.png');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 6px;
}

.agree_text_area { 
	font-size: 12px; line-height: 20px; 
}
.agree_text_area div {
	word-break: break-all !important;
}
.main_area { padding: 20px; }
.profile_area { font-size: 14px; color: #000; margin-bottom: 20px; }
.main_area > .profile_area {color: #fff;}
.profile_area > div.cash_area { margin-top: 10px; }
.profile_area > div.cash_area > span.cash {
	background-image: url('../images/D_cash.png');
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 16px;
	padding-left: 20px;  
	font-size: 22px; font-weight: bold;
}
.profile_area > div.cash_area > a.charge_button { float: right; height: 28px; padding: 5px 16px; background: #ffe131; color: #000; font-weight: bold; }

.use_state_area { font-size: 14px; }
.main_area .use_state_area { color: #fff;}
.use_state_area > ul { display: table; width: 100%; margin-bottom: 10px; table-layout: fixed; }
.use_state_area > ul::after { display: none; }
.use_state_area > ul > li { display: table-cell; }
.use_state_area > div.use_timer {height: 4px; background-color: #191919; border: 0;}
.use_state_area > div.use_timer > div.ui-widget-header { background-color: #ffe131; border: 0; }

.seat_state_area { margin-top: 10px; background-color: #191919; }
.seat_state_area > a.seat_select_button {
	display: block;
	height: 60px;
	background-image: url('../images/seat_select.png');
	background-repeat: no-repeat;
	background-position: left calc(50% - 45px) center;
	background-size: 16px;
	padding: 5px 0;  
	font-size: 14px; color: #fff; line-height: 1.4; text-align: center;
}
.seat_state_area > a.seat_select_button > span { display: block; }

.seat_state_area > ul { display: table; width: 100%; table-layout: fixed; }
.seat_state_area > ul::after { display: none; }
.seat_state_area > ul > li { display: table-cell; position: relative; }
.seat_state_area > ul > li > a {
	display: block; 
	width: 100%; height: 60px; line-height: 60px; 
	background-repeat: no-repeat;
	background-position: left calc(50% - 45px) center;
	background-size: 16px;
	color: #fff; text-align: center;
}
.seat_state_area > ul > li > a.seat_change_button {
	background-image: url(../images/seat_change.png);
}
.seat_state_area > ul > li + li > a::before {
	content: '';
	position: absolute;
	width: 1px; height: 50%;
	top: 50%; transform: translateY(-50%);
	left: 0;
	background-color: #555555;
}
.seat_state_area > ul > li > a.seat_extend_button {
	background-image: url(../images/seat_extend.png);	
}

.service_area { margin-top: 20px; }
.service_area > ul { display: table; width: 100%; table-layout: fixed; }
.service_area > ul::after { display: none; }
.service_area > ul > li { display: table-cell; position: relative; height: 100px; padding-top: 20px; vertical-align: top; }
.service_area > ul > li >  a {
	width: 100%;
	color: #fff; text-align: center;
}
.service_area > ul > li + li > a::before {
	content: '';
	position: absolute;
	width: 1px; height: 40%;
	top: 50%; transform: translateY(-50%);
	left: 0;
	background-color: #555555;
}
.service_area > ul > li >  a > * { display: block; margin-top: 5px; }
.service_area > ul > li >  a > strong { font-size: 18px; }
.service_area > ul > li >  a > span { font-size: 12px; color: #707070; margin: 0; }

.notice_area { padding: 20px 0px 0; border-top: 1px solid #333;}
.notice_area > h2 { font-size: 18px; color: #fff; margin-bottom: 15px; }
.notice_area > ul { position: relative; overflow: hidden; width: 100%; }
.notice_area > ul > li + li { margin-top: 10px; }
.notice_area > ul > li > a { color: #fff; }
.notice_area > ul > li > a > span.subject {
	display: inline-block; width: calc(100% - 100px); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}

.footer_area {position: fixed; left: 0; bottom: 0; width: 100%; padding: 10px 0px; background: #000;}
.footer_area > ul {display: table; width: 100%; table-layout: fixed;}
.footer_area > ul::after { display: none; }
.footer_area > ul > li { display: table-cell; position: relative; }
.footer_area > ul > li > a {
	display: block;
	width: 100%; height: 48px; margin-bottom: 8px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	color: #fff; text-align: center;
}
.footer_area > ul > li > a.ft_home_button { background-image: url('../images/ft_home.png') }
.footer_area > ul > li > a.ft_home_button.on { background-image: url('../images/ft_home_on.png') }
.footer_area > ul > li > a.ft_profile_button { background-image: url('../images/ft_profile.png') }
.footer_area > ul > li > a.ft_profile_button.on { background-image: url('../images/ft_profile_on.png') }

.footer_area > ul > li > a.ft_studyinfo_button { background-image: url('../images/ft_studyinfo.png') }
.footer_area > ul > li > a.ft_studyinfo_button.on { background-image: url('../images/ft_studyinfo_on.png') }

.footer_area > ul > li > a.ft_customer_button { background-image: url('../images/ft_customer.png') }
.footer_area > ul > li > a.ft_customer_button.on { background-image: url('../images/ft_customer_on.png') }


.footer_area > ul > li > a.ft_more_button { background-image: url('../images/ft_more.png') }
.footer_area > ul > li > a.ft_more_button.on { background-image: url('../images/ft_more_on.png') }

.alert_area > ul > li { position: relative; padding-bottom: 15px; border-bottom: 1px solid #f0f0f0;}
.alert_area > ul > li + li { padding-top: 15px; }
.alert_area > ul > li > a.alert_delete { 
	position: absolute; top: 0; right: 0;
	width: 15px; height: 15px;
	background-image: url('../images/alert_delete.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 15px;
}
.alert_area > ul > li + li > a.alert_delete { top: 15px; }
.alert_area > ul > li > span { display: block; margin-bottom: 5px; color: #cdcdcd; }
.alert_area > ul > li > p { padding-right: 50px; }

.charge_form > div.cash_area {text-align: center;}
.charge_form > div.cash_area > span.cash {
	display: inline-block;
	margin-top: 5px;
	background-image: url('../images/D_cash.png');
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 16px;
	padding-left: 20px;  
	font-size: 18px;
}




.charge_form > div.charge_area { margin-top: 25px; text-align: center; }
.charge_form > div.charge_area > div.input_group {position: relative;}
.charge_form > div.charge_area > div.input_group > input {width: 100%; height: 44px; margin-top: 8px; padding: 0px 10px; border: 1px solid #f0f0f0; font-size: 20px; font-weight: bold; text-align: center; color: #2440b0;}
.charge_form > div.charge_area > div.input_group > input::placeholder { color: #cdcdcd; }
.charge_form > div.charge_area > small { display: block; margin-top: 8px; color: #cdcdcd;}
.charge_form > div.charge_area > small.active { color: #000; }
.charge_form > div.charge_area > ul {display: flex; width: 100%; margin-top: 20px; flex-wrap: wrap;}
.charge_form > div.charge_area > ul > li {flex-grow: 1; position: relative; width: 50%; padding: 15px 0;}
.charge_form > div.charge_area > ul > li:nth-child(2)::before,
.charge_form > div.charge_area > ul > li:nth-child(5)::before { 
	content: '';
	position: absolute; top: 50%; left: 0; transform: translateY(-50%);
	width: 1px; height: 70%;
	background: #f0f0f0;
}
.charge_form > div.charge_area > ul > li > a > * { display: block; }
.charge_form > div.charge_area > ul > li > a > strong { font-size: 18px; }
.charge_form > div.charge_area > ul > hr { display: block; width: 100%; margin: 0; padding: 0; border: 0; border-top: 1px solid #f0f0f0;}

.charge_result_area > p.charge_result_txt { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; }
.charge_result_area > p.charge_result_txt > img { width: 32px; margin-bottom: 20px;}
.charge_result_area > p.charge_result_txt > span { display: block; margin-bottom: 5px; font-size: 20px; text-align: center; color: #2440b0}
.charge_result_area > div.charge_result_cash { position: fixed; left: 0; bottom: 0; width: 100%; text-align: center; }
.charge_result_area > div.charge_result_cash > span { 
	display: inline-block;
	margin-top: 5px;
	background-image: url('../images/D_cash.png');
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 16px;
	padding-left: 20px;  
	font-size: 18px;
}

.seat_select_area > div.seat_state_div > p {margin-bottom: 20px;}
.seat_select_area > div.seat_state_div > ul {display: flex; width: 100%; flex-wrap: wrap; justify-content: space-between;}
.seat_select_area > div.seat_state_div > ul > li {flex: 1; text-align: center; font-size: 11px;}
.seat_select_area > div.seat_state_div > ul > li > i {display: inline-block; width: 16px; height: 16px; border-radius: 5px; vertical-align: middle;} 
.seat_select_area .seat_used {background: #555555; border: 1px solid #555555; color: #fff;}
.seat_select_area .seat_unused {background: transparent; border: 1px solid #cdcdcd; color: #000;}
.seat_select_area .seat_select {background: #2440b0; border: 1px solid #2440b0; color: #fff;}
.seat_select_area .seat_change {background: #ffe131; border: 1px solid #ffe131; color: #fff;}
.seat_select_area > div.seat_table_area {margin-top: 20px; padding: 10px; padding-bottom: 0; border: 1px solid #f0f0f0; border-radius: 5px;}
.seat_select_area > div.seat_table_area > table {position: relative; width: 100%; border-spacing: 4px; table-layout: fixed;}
.seat_select_area > div.seat_table_area > table td {width: 28px; height: 28px; border-radius: 5px; font-size: 14px; font-weight: bold; text-align: center; cursor: pointer; white-space: nowrap;}
.seat_select_area > div.seat_table_area:nth-child(3) {margin-top: 0; padding-top: 0; border-top: 0;}
.seat_select_area > div.seat_table_area:nth-child(3) > table {position: relative; width: 100%; border-collapse: collapse; border-spacing: 0; table-layout: fixed;}
.seat_select_area > div.seat_table_area table td.door {border-top: 2px solid #ffe131}

.purchase_area { padding-top: 15px; border-top: 1px solid #f0f0f0; }
.purchase_area > p { font-size: 15px; font-weight: bold; margin-bottom: 8px; }
.purchase_area > p ~ p {margin-top: 20px;}
.purchase_area > div > input[name=purchase_method] {display: none;}
.purchase_area > div > label { 
	display: block; width: 100%; height: 80px;
	background: url('../images/bg_voucher_s.png');
	background-repeat: no-repeat;
	background-size: 100% 100%;
	border: 0; text-align: center;
	cursor: pointer;
}
.purchase_area > div > input[name=purchase_method_lock] {display: none;}
.purchase_area > div > label { 
	display: block; width: 100%; height: 75px;
	background: url('../images/bg_voucher_s.png');
	background-repeat: no-repeat;
	background-size: 100% 100%;
	border: 0; text-align: center;
	cursor: pointer;
}
.purchase_area > div > label > small {display: block; height: 40px; line-height: 40px;}
.purchase_area > div > label > strong {display: block; height: 40px; line-height: 40px;}
.purchase_area > div > label > span {display: block; height: 40px; line-height: 40px; font-weight: bold;}
.purchase_area > div > label > span > strong {font-size: 24px;}
.purchase_area > div > input[name=purchase_method]:checked + label {
	background-image: url('../images/bg_voucher_D_time.png');
}
.purchase_area > div > input[name=purchase_method]:checked + label > small { color: #fff; }

.purchase_area > div > input[name=purchase_method_lock]:checked + label {
	background-image: url('../images/bg_voucher_D_time.png');
}
.purchase_area > div > input[name=purchase_method_lock]:checked + label > small { color: #fff; }


.purchase_area > div > span {display: block; margin-top: 5px; text-align: center;}
.purchase_area > div.day_purchase_div,
.purchase_area > div.ex_purchase_div {
	display: block; overflow: hidden;
}
.purchase_area > div.day_purchase_div > label,
.purchase_area > div.ex_purchase_div > label {
	float: left; width: calc(33.33333333333% - 10px); margin: 0 5px 10px;
}
.purchase_area > div.day_purchase_div > label ~ label,
.purchase_area > div.ex_purchase_div > label ~ label {
}
.purchase_area > div > label > small.cash {
    background-image: url(../images/D_cash.png);
    background-repeat: no-repeat;
    background-position: left calc(50% - 20px) center;
    background-size: 16px;
    padding-left: 20px;
}
.purchase_area > div.day_purchase_div > input[name=purchase_method]:checked + label {
	background-image: url('../images/bg_voucher_day.png');
}
.purchase_area > div.ex_purchase_div > input[name=purchase_method]:checked + label {
	background-image: url('../images/bg_voucher_ex.png');
}
.purchase_area > div.day_purchase_div > input[name=purchase_method]:checked + label > small,
.purchase_area > div.ex_purchase_div > input[name=purchase_method]:checked + label > small {
	color: inherit;
}
.purchase_area > div.ex_purchase_div > input[name=purchase_method]:checked + label > span {
	color: #fff;
}


.purchase_area > div.day_purchase_div > input[name=purchase_method_lock]:checked + label {
	background-image: url('../images/bg_voucher_ex.png');
}

.purchase_area > div.day_purchase_div > input[name=purchase_method_lock]:checked + label > small,
.purchase_area > div.day_purchase_div > input[name=purchase_method_lock]:checked + label > small {
	color: inherit;
}
.purchase_area > div.day_purchase_div > input[name=purchase_method_lock]:checked + label > span {
	color: #fff;
}

.button_area > p.purchase_comment {margin-bottom: 10px; text-align: center; color: #cdcdcd;}
.button_area > p.purchase_comment.active { color: #000; }
.button_area > button > span.cash {
	position: absolute;
	top: 80px; left: 75%;
	background-image: url(../images/D_cash.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 16px;
    padding-left: 20px;
}

.smn_rows span.cash {
	display: inline-block;
	margin-top: 5px;
	background-image: url('../images/D_cash.png');
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 16px;
	padding-left: 20px;  
	font-size: 13px;
}


.smn_rows { position: relative; width: 100%; min-height: 100px; border-radius: 3px; border: 1px solid #f0f0f0; margin-bottom: 13px; cursor: pointer; }
.smn_rows > ul {}
.smn_rows > ul > li { float: left; width: calc(100% - 100px); padding: 13px; }
.smn_rows > ul > li:first-child { 
	width: 100px; height: 100px; background-size: cover; background-repeat: no-repeat; background-position: center center;  
	border-top-left-radius: 3px; border-bottom-left-radius: 3px;
}
.smn_rows > ul > li > div:first-child { font-weight:  700; }
.smn_rows > ul > li > div:nth-child(2) { font-size: 12px; margin-top: 5px; color: #555555; }

.smn_this_modth { text-align: center; margin-top: 20px; font-weight: 700; font-size: 16px;}

.smn_this_week { margin-top: 15px; }
.smn_this_week > ul {overflow: auto; white-space:nowrap; }
.smn_this_week > ul > li { display:inline-block; white-space:nowrap; width: 14.25871428571429%; text-align: center; color: #cdcdcd; border-bottom: 2px solid #f7f7f7; cursor: pointer; }
.smn_this_week > ul > li > div:first-child { font-size: 10px; color: #cdcdcd; }
.smn_this_week > ul > li > div:last-child { font-size: 13px; color: #cdcdcd; padding: 8px 0px; font-weight: 700; }
.smn_this_week > ul > li.active { border-bottom: 2px solid #2440b0; }
.smn_this_week > ul > li.active > div:first-child { color: #2440b0; }
.smn_this_week > ul > li.active > div:last-child { color: #2440b0; }

.smn_ampm { margin-top: 15px; }
.smn_ampm > ul { width: 120px; margin: auto; }
.smn_ampm > ul > li { float: left; width: 60px; text-align: center; color: #cdcdcd; border-bottom: 2px solid #f7f7f7; cursor: pointer; }
.smn_ampm > ul > li > div:first-child { font-size: 13px; color: #cdcdcd; padding: 8px 0px; font-weight: 700; }
.smn_ampm > ul > li.on { border-bottom: 2px solid #2440b0; }
.smn_ampm > ul > li.on > div:first-child { color: #2440b0; }

.smn_time_selecter { margin-top: 20px; }
.smn_time_selecter > ul { width: calc(100% + 4px); margin-left: -2px; }
.smn_time_selecter > ul > li { float: left; margin: 1px 2px; width: calc(20% - 4px); padding: 6px 0px; text-align: center; border-radius: 2px; font-size: 13px;  }
.smn_time_selecter > ul > li.am { display: none; }

.select_data_area { margin-top: 30px; }
.select_data_area > ul {}
.select_data_area > ul > li { float: left; width: 50%; padding: 0px 15px; }
.select_data_area > ul > li > p { text-align: center; }
.select_data_area > ul > li > p:first-child { font-size: 13px; font-weight: 700; }
.select_data_area > ul > li > p:last-child { border: 1px solid #f0f0f0; margin-top: 10px; }
.select_data_area > ul > li > p > input {
	width: 100%; border: none; line-height: 36px; padding: 0px 10px; text-align: center;
}

.select_data_area > ul > li:last-child > p:last-child > input { width: calc(50% - 10px); padding: 0px 2px; }

.faq_list_area {}
.faq_list_area > ul {}
.faq_list_area > ul > li { width: 100%; cursor: pointer; margin-top: 10px; border-bottom: 1px solid #f7f7f7; font-size:13px; }
.faq_list_area > ul > li > div.qus { line-height: 30px; padding-bottom: 5px;}
.faq_list_area > ul > li > div.ans { display: none; position: relative; padding: 7px; background: #f8f8f8; padding-left: 22px; line-height: 20px; margin-bottom: 10px; }
.faq_list_area > ul > li > div.ans > span { position: absolute; left: 7px; }
.faq_list_area > ul > li > div.notopen { 
    background-image: url(../images/arrow_down.png);
    background-repeat: no-repeat;
    background-position: right top 12px;
    background-size: 9px;
}
.faq_list_area > ul > li > div.okopen { 
    background-image: url(../images/arrow_up.png);
    background-repeat: no-repeat;
    background-position: right top 12px;
    background-size: 9px;
}


.profile_img_area { margin: 20px auto; width: 76px; height: 76px; }
.profile_img_area > div { width: 100%; height: 100%; position: relative; background-size: cover; background-repeat: no-repeat; background-position: center center; border-radius: 50%; }
.profile_img_area > div > a { position: absolute; right: 0px; bottom: 0px; }
.profile_img_area > div > a > img { width: 24px; }

.abort_a { color: #cdcdcd !important; font-weight: 700; border-bottom: 1px solid #cdcdcd; font-size: 12px !important; padding-bottom: 2px;}

.notice_rows { font-weight: 700; padding-bottom: 8px; margin-bottom: 20px; border-bottom: 1px solid #f8f8f8; }
.notice_rows > a { 
	display: inline-block; width: 100%; line-height: 20px; font-size: 13px; font-weight: 700; 
}
.notice_rows > a > div.date_txt { color: #cdcdcd; }
.notice_rows > a > div.subject {
	width: 100%; word-break: break-all;
}
.notice_comment_txt {
	width: 100%; word-break: break-all;
}
.notice_comment_txt img { width: 100% !important; }

.graph_main_viwer > div.title_txt {
    font-size: 17px;
    font-weight: 800;
    color: #000;
}

.graph_main_viwer > div.title_txt > span {
    font-size: 13px;
    font-weight: 400;
    margin-right: 5px;
    color: #5a6174;
}
