@charset "utf-8";

*{margin:0;padding:0;}
body{width: 100%;}

button{border:0;background:0;}
input[type="text"]{height:25px;background:#DFDFDF;padding-left:5px;border:0;border-radius:3px;}
textarea{background:#DFDFDF;padding-left:5px;padding-top:5px;border:0;border-radius:3px;height:80px;}
button.mini-btn{background:#86CCA7;color:#FFFFFF;line-height:1;padding:3px;border-radius:2px;cursor:pointer;}

.red{color:red;}
.example{font-size:smaller;}
.large_bold{font-size:large;font-weight:bold;color:#007231;}

header{max-width:1000px;margin:30px auto 0;}
ul.explain{font-size:large;font-weight:bold;line-height:1.2;list-style-type:disc;margin-left:1em;}
ul.explain>li{margin-bottom:10px;}
ul.steps{ display:block;list-style-type:none;font-size:0;width:100%;margin:30px auto 0; }
ul.steps>li{ display:inline-block;width:25%;}
ul.steps>li>span{ display:block;margin:0 auto;border:2px solid transparent;width:98%;box-sizing:border-box;height:50px;line-height:50px;text-align:center;font-size:18px;font-weight:bold; }
ul.steps>li.current>span:after{content:" ";display:block;width:0px;margin:-2px auto 0;height:0;border:10px solid transparent;border-top:16px solid transparent;border-bottom:0;}

ul.steps>li>span{border-color:#C9C9C9;color:#C9C9C9;}
ul.steps>li.current>span {
    border-color: #000;
    color: #FFFFFF;
    background: #000;
}
ul.steps>li.current>span:after {
    border-top-color: #000;
}

/* これまで入力した内容 */
.confirm{width:98%;max-width:800px;margin:50px auto 0;}
.confirm p{width:98%;margin:0 auto 5px;}
table.now{width:100%;}
table.now>caption {
    text-align: left;
    color: #cc0000;
    font-weight: bold;
    font-size: 20px;
    padding-bottom: 5px;
}
table.now>caption>img{vertical-align:middle;}
table.now>caption>span{vertical-align:middle;padding-left:8px;}
table.now>*>tr{border-bottom:1px solid #D2D2D2;}
table.now>*>tr:first-child{border-top:1px solid #D2D2D2;}
table.now>*>tr>th{width:23%;padding:10px 0;text-align:left}
table.now>*>tr>td{padding:10px 0;word-break: break-word;}

/* これから入力する内容 */
.menu{margin-top:50px;max-width:800px;margin:50px auto 0;}
.menu p{font-size:15px;line-height:1.7;margin-bottom:5px;}
.number{margin-top:50px;max-width:800px;margin:50px auto 0;}
.info{margin-top:50px;max-width:800px;margin:50px auto 0;}
table.future{width:100%;border:1px solid #D2D2D2;border-radius:5px;}
table.future>caption{text-align:left;font-weight:bold;font-size:18px;padding-bottom:5px;}
table.future>tbody>tr>th{width:25%;padding:10px;border:1px solid #D2D2D2;}
table.future>tbody>tr>td{padding:10px;border:1px solid #D2D2D2;line-height:1.7;}
table.future>tbody>tr:first-child>th{border-top-left-radius:5px;}
table.future>tbody>tr:first-child>td{border-top-right-radius:5px;}
table.future>tbody>tr:last-child>th{border-bottom-left-radius:5px;}
table.future>tbody>tr:last-child>td{border-bottom-right-radius:5px;}

/* レベルの動画 */
.level{max-width:1000px;margin:80px auto 0;}
.level p{text-align:center;font-size:middle;}
ul.movies{display:block;font-size:0;text-align:center;width:100%;margin-bottom:50px;}
ul.movies>li{display:inline-block;width:32%;margin:0 0.5%;font-size:x-large;font-weight:bold;text-align:left;line-height:1.7;}
ul.movies>li video{width:100%;}
 
/* 上部タブの設定 */
.month{margin-top:50px;}
.month p{width:750px;margin:0 auto;margin-bottom:10px;}
.month-list input[type="radio"]{display:none;}
.month-list{width:750px;margin:0 auto;-webkit-padding-start:0px;-moz-padding-start: 0px;padding-start:0px;padding:0px;list-style-type:none;}
.month-list span{display:block;float:left;width:170px;height:45px;margin:0 3px 3px 0;border-radius: 10px 10px 0 0;text-align:center;line-height:45px;font-weight:bold;font-size:18px;cursor:pointer;}
input[name="month"]:checked + span{height:49px;margin:0 3px 0 0;}

/* 上部タブの色 */

.month-list span{background-color:#bfbfbf;color:#7f7f7f;}
input[name="month"]:checked + span {
    background-color: #f9dad9;
    color: #000000;
}



/* 横幅の設定 */

.calender{width:750px;margin:-1px auto 0;}
table.day-calender input{ display:none; }
table.day-calender,
table.day-calender>*,
table.day-calender>*>tr{display:block;width:100%;padding:0;margin:0;border:0;position:relative;}
table.day-calender>thead>tr>th,
table.day-calender>tbody>tr>td{display:inline-block;padding:0;margin:0;border:0;}
table.day-calender{min-width:400px;font-size:0;}
table.day-calender>*>tr{text-align:center;}
table.day-calender{padding:10px 0 30px 0;border-radius:0 10px 10px 10px;}
table.day-calender>thead>tr>th{width:13.5%;border-style:solid;border-right-width:1px;border-bottom-width:1px;border-color:transparent}
table.day-calender>tbody>tr>td{width:13.5%;border-style:solid;border-right-width:1px;border-bottom-width:1px;}
table.day-calender>*>tr>td:first-child{border-left-width:1px;}
table.day-calender>thead>tr>th{font-size:x-large;text-align:center;padding-top:10px;}
table.day-calender>tbody>tr:first-child>td{border-top-width:1px;}
table.day-calender>tbody>tr>td>label,
table.day-calender>tbody>tr>td>label>span{display:block;width:100%;height:100%;}
table.day-calender>tbody>tr>td>label>span>.title{display:block;width:90%;height:30%;padding:5%;font-size:x-large;text-align:left}
table.day-calender>tbody>tr>td>label>span>.able{display:block;width:100%;height:40%;font-size:large;text-align:center}
table.day-calender>tbody>tr>td>label>span{cursor:default;}
table.day-calender>tbody>tr>td>label:hover>input+span{cursor:pointer;}
table.day-calender>tbody>tr>td>label>input:checked+span{cursor:default;}

/* 縦幅の設定 */
table.day-calender>tbody>tr>td{height:90px;}

table.day-calender {
    background: #f9dad9;
    border-color: #f9dad9;
} /* 背景色 */
table.day-calender>tbody>tr>td{background:#FFFFFF;border-color:#BCBCBC} /* 通常セルの色 */
table.day-calender>tbody>tr>td:empty{background:#FFFFFF;} /* 空白セルの色 */
table.day-calender>thead>tr>th:first-child,table.day-calender>tbody>tr>td:first-child>label>span>.title{color:#E30010} /* 日曜日の文字色 */
table.day-calender>thead>tr>th:last-child,table.day-calender>tbody>tr>td:last-child>label>span>.title{color:#1E1F8B} /* 土曜日の文字色 */
table.day-calender>tbody>tr>td>label>span>.able{color:#458BC9} /* ✕の色 */
table.day-calender>tbody>tr>td>label>input+span>.able{color:#DC4B3E;} /* ◯の色 */
table.day-calender>tbody>tr>td>label:hover>input+span{background:#E0F2E8;} /* マウスオーバー時のの色 */
table.day-calender>tbody>tr>td>label>input:checked+span{background:#86CCA7;} /* 選択セルの色 */


/* タイムテーブルの設定 */
.time{margin-top:40px;padding-top:10px;}
.time p{width:550px;margin:0 auto 10px;}
.time p b{color:red;font-size:larger;}
.time-table input[type="radio"]{display:none;}
.time-table input[type="checkbox"]{display:none;}
.time-table{width:550px;margin:0px auto;}
.time-table  th{width:260px;height:50px;}
.time-table  td{width:260px;height:50px;text-align:center;}
.time-table  label{width: 100%;height:100%;display: block;}
.time-table  td span{height: 50px;line-height: 50px;width:100%;}
.time-table  label>input+span{cursor:pointer;}
.time-table th,.time-table td{padding:0;cellpadding:0;cellspacing:0;}

/* タイムテーブルの色 */
.time-table th {
    background-color: #f9dad9;
    border: 1px solid #bcbcbc;
}
.time-table  td{border:1px solid #bcbcbc;}
.time-table  label>span{display:block;color:#458BC9}
.time-table  label>input+span{color:#DC4B3E;}
input[name="time[]"]:checked + span{background:#86CCA7;}

/* エラー */
.error{width:94%;max-width:740px;margin:50px auto 0;padding:20px; border:1px solid #DC6B5E;background:#FEF4F4;color:#E30010;line-height:2;border-radius:3px;box-sizing:border-box;}
.error:empty{display:none;}

/* ボタンの設定 */

.next_btn{max-width:1000px;margin:30px auto 60px auto;text-align:center;}
.next_btn>button{display:inline-block;margin:0 1%;width:25%; height:60px;border:none;border-radius:8px;background-color:#BDBDBD;color:#ffffff;font-size:19px;font-weight:bold;cursor:pointer;}
.next_btn>button:hover{opacity:0.7;}

/* ボタンの色 */
.next_btn>button#next{background-color:#cc0000;}
.next_btn>button#level1{background-color:#389D65;}
.next_btn>button#level2{background-color:#F79C4D;}
.next_btn>button#level3{background-color:#4489CA;}

/* 共通の設定 */
.clear:after{content: "";clear: both;height: 0;display: block;visibility: hidden;}
table{border-collapse: collapse;empty-cells:show;box-sizing:border-box;}

.end{width:96%;max-width:800px;margin:50px auto;}
.end p{width:100%;}

/*tab・sp*/

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

ul.steps>li>span{ font-size:13px; }

ul.movies>li{width:70%;font-size:medium;margin-bottom:20px;}

.month p{width:96%;margin:0 auto 10px;}
.month-list{width:95%;margin:0 auto;}
.month-list span{width:32.33%;margin:0 1% 0.5% 0;font-size:13px;}
input[name="month"]:checked + span{height:48px;margin:0 1% 0 0;}

.time p{width:85%;margin:0 auto 10px;}
.time-table{width:85%;margin:30px auto;}
.time-table  th{width:50%;height:40px;}
.time-table  td{width:50%;height:40px;}
.time-table  td span{height: 40px;line-height: 40px;}

.calender{width:95%;margin:-1px auto 0;padding:0;}
}



.caution {
    text-align: center;
    color: red;
    padding-bottom: 10px;
}
a.btn.check-btb {
    color: #000;
    text-decoration: none;
    border: 1px solid #a9a9a9;
    font-size: 14px;
    border-radius: 5px;
    padding: 1px 5px;
    box-shadow: 0px 1px 1px #ababab;
}
.date-td {
    display: flex;
}
textarea.textarea {
    width: 99%;
    height: 100px;
    max-height: 300px;
    max-width: 570px;
}
input[type="checkbox"] {
    margin: 0 5px 0 0;
}
input.short {
    width: 13%;
}
input.middle {
    width: 57.5%;
}
.kome {
    font-size: 14px!important;
}
span.shop-name {
    margin-left: 20px;
    font-weight: bold;
    font-size: 18px;
}
a.back-btn {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    margin: 0 1%;
    width: 25%;
    height: 60px;
    border: none;
    border-radius: 8px;
    background-color: #BDBDBD;
    color: #ffffff;
    font-size: 19px;
    font-weight: bold;
    cursor: pointer;
}





/*sp*/

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

ul.steps>li>span{ font-size:10px; }

table.now>*>tr>td{font-size:small;}

.month-list span{font-size:13px; font-weight:normal;}
table.day-calender>tbody>tr>td>label>span>.title{font-size:12px;}
table.day-calender>thead>tr>th{width:13%;font-size:13px;border-style:solid;border-right-width:1px;border-bottom-width:1px;border-color:transparent}
table.day-calender>tbody>tr>td{/*width:13%;*/min-width:40px;height:45px;border-style:solid;border-right-width:1px;border-bottom-width:1px;position:relative;}
table.day-calender{min-width:300px;font-size:0;width:100%;box-sizing: border-box;}
.time-table th,.time-table td{font-size:12px;height:30px;}

.next_btn{width:200px;margin:30px auto 60px auto;}

.next_btn>button{width:200px; height:45px;border:none;font-size:17px;margin-bottom:30px;}

table.day-calender>tbody>tr {
    display: flex;
    justify-content: center;
    align-items: center;
}
a.back-btn{
    width: 200px;
    height: 45px;
    font-size: 17px;
}

}


@media screen and (min-width:481px){
.pc_none{display:none !important;}
}
@media screen and (max-width:480px){
.sp_none{display:none !important;}
}