@charset "UTF-8";
@import url("./common/reset.css");
@import url("./common/advanced.css");
@import url("./common/base.css");

/*------------------------------------------------------------
料金案内
-------------------------------------------------------------*/
.system{ margin: 0 auto; padding: 20px 0 60px;}

/* 料金表
------------------------------------------------------------ */
.price_list_wrap{ background: #fff; padding: 25px 0 40px;}
.price_list_wrap .att_kensa{ font-size: 21px; text-align: center; color: #dc4873; border-bottom: 5px solid #fff5f0; padding-bottom: 25px; margin-bottom: 30px;}

.price_list{}

/*料金名*/
.price_list .tit_wrap{ box-sizing: border-box; height: 72px; background: url(../images_design/system/course_tit_bg.png) left center no-repeat; background-size: 133px 72px; display: flex; flex-wrap: wrap; justify-content: left; align-items: center; margin: 0 10px 20px;}
.price_list .tit_wrap h3{ padding: 0 20px 0 155px; font-size: 38px;}
.price_list .tit_wrap p{ color: #c43852; letter-spacing: 0.6em;}

.price_list .price_wrap{ box-sizing: border-box; display: flex; flex-wrap: wrap; justify-content: left; padding: 0 45px;}
.price_list .price_wrap li{ box-sizing: border-box; width: 50%; padding: 5px; position: relative;}
.price_list .price_wrap li .item_wrap{ box-sizing: border-box; height: 70px; line-height: 0.2; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; background: #eee;}
.price_list .price_wrap li.icon_mic:before{ content: ""; display: block; width: 60px; height: 60px; background:url(../images_design/system/icon_minamiic.png) no-repeat; background-size: 60px 60px; position: absolute; left: 10px; top: 10px;}

/*価格*/
.price_list .price_wrap li .item_wrap .item_l,
.price_list .price_wrap li .item_wrap .item_r{ box-sizing: border-box; color: #dc1950;}
.price_list .price_wrap li .item_wrap .item_l{ width: 41%; font-size: 46px; text-align: right;}
.price_list .price_wrap li .item_wrap .item_r{ width: 59%; font-size: 46px; text-align: left; position: relative; padding-left: 50px;}
.price_list .price_wrap li .item_wrap .item_l span,
.price_list .price_wrap li .item_wrap .item_r span{ font-size: 0.6em; padding-left: 3px;}
.price_list .price_wrap li .item_wrap .item_r:before{ content: ""; display: block; width: 20px; height: 20px; position: absolute; left: 0px; top: calc(50% - 1px); border-top: solid 1px; border-right: solid 1px; transform: rotate(45deg) translateY(-50%); color: inherit; border-color: #dc1950; }

/*延長*/
.price_list .extension_fee{ font-size: 28px; text-align: right; margin-bottom: 20px; padding-right: 45px; line-height: 1;}
.price_list .extension_fee span{ font-size: 1.4em; padding: 0 5px;}

/*注意事項*/
.price_list .remarks{ box-sizing: border-box; margin:  0 45px; padding: 16px 20px; font-size: 16px; background: #eee;}
.price_list .remarks p{ font-size: 16px; text-align: left; position: relative; padding-left: 1.1em; color: #dc1950;}
.price_list .remarks p:before{ content: '※'; position: absolute; top: 0; left: 0;}

/*背景色*/
.price_list.list01 .price_wrap li .item_wrap,.price_list.list01 .remarks{ background: #fff5f0;}
.price_list.list02 .price_wrap li .item_wrap,.price_list.list02 .remarks{ background: #fff9df;}
.price_list.list03 .price_wrap li .item_wrap,.price_list.list03 .remarks{ background: #f5fcf3;}
.price_list.list04 .price_wrap li .item_wrap,.price_list.list04 .remarks{ background: #eafdfd;}

.hotel_info{ font-size: 21px; text-align: center; color: #dc4873; background: #ffc;  margin: 0 45px 20px; padding: 15px 0;}

/* 基本プレイ内容
------------------------------------------------------------ */
.basicplay_list{ background: #dc4873; margin: 0 45px;}

.basicplay_list .tit_wrap{ box-sizing: border-box; height: 72px; display: flex; flex-wrap: wrap; justify-content: left; align-items: center; color: #fff; padding-left: 30px;}
.basicplay_list .tit_wrap h3{ font-size: 30px;}
.basicplay_list .tit_wrap p{ letter-spacing: 0.3em; padding-left: 15px;}

.basicplay_list ul{ box-sizing: border-box; display: flex; flex-wrap: wrap; justify-content: left; align-items: center; padding: 0 30px 30px;}
.basicplay_list li{ box-sizing: border-box; width: 20%; height: 50px; background: #fff; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; border: 1px solid #dc4873;}
.basicplay_list li p{ font-size: 20px; color: #dc4873; text-align: center;}

/* その他料金共通
------------------------------------------------------------ */
.cmn_fee_list{ margin: 0 45px;}

.cmn_fee_list .tit_wrap{ box-sizing: border-box; background: #998675; height: 64px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; color: #fff;}
.cmn_fee_list .tit_wrap h3{ font-size: 30px;}
.cmn_fee_list .tit_wrap p{ letter-spacing: 0.3em; padding-left: 15px;}

.cmn_fee_list .cmn_fee_list_inner{ box-sizing: border-box; border: 1px solid #998675; padding: 20px;}

.cmn_fee_list .cmn_fee_list_inner ul{ box-sizing: border-box; display: flex; flex-wrap: wrap; justify-content: left;}

.cmn_fee_list .cmn_fee_list_inner li{ box-sizing: border-box; padding: 5px; position: relative;}
.cmn_fee_list .cmn_fee_list_inner li .item_outer{ box-sizing: border-box; height: 100%; border: 1px solid #d8d8d8; padding: 0 10px;}
.cmn_fee_list .cmn_fee_list_inner li .item_wrap{ box-sizing: border-box; display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}

.cmn_fee_list .cmn_fee_list_inner li .item_wrap .item_l{ box-sizing: border-box; line-height: 1.2;}
.cmn_fee_list .cmn_fee_list_inner li .item_wrap .item_r{ box-sizing: border-box; line-height: 0.2;}
.cmn_fee_list .cmn_fee_list_inner li .item_wrap .item_r span{ font-size: 0.6em; padding-left: 3px;}
.cmn_fee_list .cmn_fee_list_inner li .item_wrap .item_r:before{ content: ""; display: block; width: 14px; height: 14px; position: absolute; left: 0px; top: calc(50% - 1px); border-top: solid 1px; border-right: solid 1px; transform: rotate(45deg) translateY(-50%); color: inherit; border-color: #333; }

/* 指名料
------------------------------------------------------------ */
.cmn_fee_list.nomination li{ width: 50%;}
.cmn_fee_list.nomination .item_wrap{ height: 60px; border-bottom: 1px solid #d8d8d8;}
.cmn_fee_list.nomination .item_wrap .item_l{ width: 50%; font-size: 30px; text-align: right;}
.cmn_fee_list.nomination .item_wrap .item_r{ width: 50%; font-size: 38px; text-align: left; position: relative; padding-left: 36px;}
.cmn_fee_list.nomination .att{ text-align: right; font-size: 16px; padding: 5px 10px 8px;}
.cmn_fee_list.nomination .att span{ font-size: 1.6em; padding: 0 5px;}

/* オプション
------------------------------------------------------------ */
.cmn_fee_list.option li{ width: 50%;}
.cmn_fee_list.option .item_wrap{ height: 70px;}
.cmn_fee_list.option .item_wrap .item_l{ width: 75%; font-size: 22px; text-align: left;}
.cmn_fee_list.option .item_wrap .item_r{ width: 25%; font-size: 34px; text-align: left; position: relative; padding-left: 36px;}
.cmn_fee_list.option .att{ text-align: right; font-size: 16px; padding: 5px 10px 8px;}
.cmn_fee_list.option .att span{ font-size: 1.6em; padding: 0 5px;}

/* 交通費
------------------------------------------------------------ */
.cmn_fee_list.fare .area_tit_wrap{ box-sizing: border-box; background: #EBE7E3; height: 50px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; color: #333; margin: 0 5px 5px;}
.cmn_fee_list.fare .area_tit_wrap h4{ font-size: 24px;}
.cmn_fee_list.fare .area_tit_wrap p{ letter-spacing: 0.5em; padding-left: 15px;}

.cmn_fee_list.fare li{ width: 50%;}
.cmn_fee_list.fare .item_wrap{ height: 70px;}
.cmn_fee_list.fare .item_wrap .item_l{ width: 72%; font-size: 22px; text-align: left;}
.cmn_fee_list.fare .item_wrap .item_r{ width: 28%; font-size: 34px; text-align: left; position: relative; padding-left: 36px;}
.cmn_fee_list.fare .att{ text-align: right; font-size: 16px; padding: 5px 10px 8px;}
.cmn_fee_list.fare .att span{ font-size: 1.6em; padding: 0 5px;}

/* 利用規約
------------------------------------------------------------ */
.terms{ box-sizing: border-box; background: #fff; padding: 0 45px 50px;}
.terms .terms_inner{ box-sizing: border-box; padding: 30px; border: 1px solid #948776;}

.terms .terms_inner .ban_list{ margin-bottom: 10px;}
.terms .terms_inner .ban_list dl{ display: flex;}
.terms .terms_inner .ban_list dl dt{ width: 26px;}