@charset "UTF-8";

.page_login_form{background:#ffe467;padding:3rem 0;}

.req_regist_member{background:#fff7d1;padding:3rem 0;}

.input_login{width:90vw;max-width:450px;margin:2em auto 0em;}
.input_login > dl{display:flex;margin-bottom:2em;}
.input_login > dl > dt{flex-shrink:0;font-size:1.25em;width:9em;background:#564290;color:#FFF;display:flex;align-items:center;justify-content:center;}
.input_login > dl > dd{flex-grow:1;}
.input_login > dl > dd input{width:100%;font-size:1.25em;padding:0.4em;border:2px solid #564290;box-sizing:border-box;}

.req_regist_member h2{font-size:2rem;margin-bottom:2rem;}

.input_regist{margin-bottom:2rem;}
.input_regist .controll{padding:1rem 0;}

.input_regist .tank_selects{}
.input_regist .tank_selects .count_num{border:1px solid #182466;display:flex;margin-bottom:0.75rem;position:relative;}
.input_regist .count_num .unit{content:'個';display:block;font-size:1.125rem;font-weight:bold;position:absolute;right:0.3rem;bottom:0.3rem;}
.input_regist .count_num > span,
.input_regist .tank_selects_other > span{cursor:pointer;flex-grow:1;border-right:1px solid #182466;display:flex;height:4em;align-items:center;padding:0.1em 0.2em 0.1em 4em;background-position:left center;background-repeat:no-repeat;background-size:auto;font-size:1rem;}
.input_regist .count_num > select{flex-shrink:0;width:4rem;font-size:1.5rem;color:#182466;border:0;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:bold;-webkit-appearance: none;-moz-appearance: none;appearance: none;}
.input_regist .count_num > select option{font-size:1rem;}
.tank_other_caption{width:100%;height:5em;margin:0 0 1em;}

.input_regist .count_num.home_490l > span{background-image:url(../image/order_oil/icon_tank_home_490l.png);}
.input_regist .count_num.home_200l > span{background-image:url(../image/order_oil/icon_tank_home_200l.png);}
.input_regist .count_num.outer_90l > span{background-image:url(../image/order_oil/icon_tank_outer_90l.png);}
.input_regist .count_num.herf_200l > span{background-image:url(../image/order_oil/icon_tank_herf_200l.png);}
.input_regist .count_num.inner_90l > span{background-image:url(../image/order_oil/icon_tank_inner_90l.png);}
.input_regist .count_num.pori_tank > span{background-image:url(../image/order_oil/icon_tank_pori_tank.png);}
.input_regist .tank_selects_other span{background-image:url(../image/order_oil/icon_tank_other.png);border-right:1px solid #182466;}
.input_regist .tank_selects_other > textarea{flex-grow:1;min-width:57%;padding:0.2em;border:0px;height:auto;border:1px solid #182466;border-left:0;margin-bottom: 0.75rem;}

.page_link_tab{padding-bottom:3rem;}
.page_link_tab .btn.tab{border:2px solid #564290;}
.page_link_tab .btn.tab:after{border-left:0.3em solid transparent;border-top:0.5em solid #564290;}

.center.error{border:2px solid #FF0000;background:#FFF;padding:0.5em;}
.center.error em{font-size:1.25em;font-weight:600;color:#FF0000;}

#delete_member{padding:3rem 0;}
#delete_member h2{font-size:2rem;margin-bottom:2rem;}


.input_regist dl{display:flex;margin-bottom:1rem;background:none;}
.input_regist dl dt{flex-shrink: 0;font-size: 1.25em;width: 13em;padding:0 1rem;background: #564290;color: #FFF;display: flex;align-items: center;justify-content: flex-start;border-right:2px solid #FFF;}
.input_regist dl dd{flex-grow:1;box-sizing:border-box;position:relative;}
.input_regist dl dd .err{position:absolute;z-index:10;background:#FF0000;color:#FFF;display:block;padding:0.2em 0.3em;right:0;top:0;}
.input_regist dl dd > .bg_w{border:2px solid #564290;}
.input_regist dl dd > .bg_w.em{font-size:1.25em;color:#000;}
.input_regist > dl > dd input{width:100%;font-size:1.25em;padding:0.4em;border:2px solid #564290;box-sizing:border-box;}
.input_regist > dl > dd textarea{width:100%;font-size:1em;padding:0.4em;border:2px solid #564290;box-sizing:border-box;height:6em;}

.input_regist dl > dd label{box-sizing:border-box;display:flex;}
.input_regist dl > dd label > span{flex-shrink:0;margin:0;padding:0.4em;min-width:7em;flex-shrink:0;color:#FFF;display:flex;align-items:center;justify-content:center;background:#564290;box-sizing:border-box;}
.input_regist dl > dd label > span+input{flex-grow:1;}
.input_regist dl > dd label.inline{display:inline-block;margin-right:1em;}
.input_regist dl > dd label.inline input[type=radio]{display:inline-block;vertical-align: middle;width: auto;margin-right: 0.25em;}


.input_regist dl > dd p{font-size:0.875rem;}
.input_regist dl > dd ul.caption{background:#FFF;margin:0;padding:0.5em;}
.input_regist dl > dd ul.caption >li{font-size:0.875rem;}

.input_regist .btn_wrap input[type=radio],
.input_regist .btn_wrap input[type=checkbox]{display:none;}
.input_regist .btn_wrap input[type=radio]+span.btn{display:flex;height:3.5em;background:#FFF;border:2px solid #182466;color:#182466;align-items:center;justify-content:center;border-radius:0;width:auto;font-size:1rem;text-align:center;font-size:1em;width:100%;}
.input_regist .btn_wrap input:checked[type=radio]+span.btn{background-color:#ff6498;color:#FFF;}
.input_regist .btn_wrap input[type=radio]+span.btn:after{display:none;}


.visual_radio_blk{}
.visual_radio_blk label{display:block;font-weight:bold;box-sizing:border-box;position:relative;margin-bottom:1em;}
.visual_radio_blk label .change_contacts{display:none;}
.visual_radio_blk label .change_contacts+div{font-weight:bold;box-sizing:border-box;position:relative;display:block;border:2px solid #564290;background:#FFF;padding:0.75em 0.75em;width:100%;height:100%;cursor:pointer;}
.visual_radio_blk label .change_contacts+div > span{padding-left: 2.4em;display:block;font-size:1.5em;position:relative;text-align:left;}
.visual_radio_blk label .change_contacts+div > span+p{padding:1em 0.5em 0.5em  1em;font-weight: normal;font-size: 1em;line-height: 1.6;margin:0;text-align:left;}
.visual_radio_blk label .change_contacts+div > span:before,
.visual_radio_blk label .change_contacts+div > span:after{content:'';display:block;border-radius:50%;position:absolute;top:50%;}
.visual_radio_blk label .change_contacts+div > span:before{width:1em;height:1em;background:#FFF;border:2px solid #564290;left:0.75em;margin-top:-0.6em;}
.visual_radio_blk label .change_contacts+div > span:after{background:#FFF;width:0.6em;height:0.6em;left:1.05em;margin-top:-0.3em;}
.visual_radio_blk label .change_contacts:checked+div{background:#564290;color:#FFF;}
.visual_radio_blk label .change_contacts:checked+div > span:after{background:#ff6498;}

.select_contacts_blk{}
.select_contacts_blk .selected_contact{display:none;}
.select_contacts_blk .selected_contact.active{display:block;}

.select_contacts_caption{display:none;}
.select_contacts_caption.active{display:block;}

form.complete_regist .input_only,
form.edit_complate .input_only{display:none;}
form.confim_regist .confim_only,
form.edit_regist .confim_only{display:none;}

.order_list_tbl{border:3px solid #7062cf;display: table;width:100%;background:#FFF;}
.order_list_tbl th{background:#7062cf;padding:1em;color:#FFF;font-size:0.875em;text-align:center;}
.order_list_tbl tr{border-bottom:1px solid #999;}
.order_list_tbl tr:nth-child(odd){background:#f4f4f4;}
.order_list_tbl td{color:#454545;padding:1em;font-size:0.875em;text-align:center;}


.no_controll_wrap{position:fixed;top:0;left:0;width:100vw;height:100dvh;display:none;}
.no_controll_wrap.active{background:#FFFFFF99;pointer-events:none;display:flex;align-items:center;justify-content:center;z-index:1100;}
.no_controll_wrap .modal{position:relative;width:50vw;max-width:200px;display:flex;padding:2em;background:#FFF;box-shadow:0 0 10px 0 #00000045;display:flex;height:100px;align-items:center;justify-content:center;}

.kiyaku_modal {
    max-width: 800px;
    width: 90%;
    height: 400px;
    overflow: auto;
    margin: 20px auto;
    background: #fff;
    border: 1px solid #d2d2d2;
    color: #777777;
    padding: 20px;
    line-height: 21px;
    margin-bottom: 50px;
}

.kiyaku_modal p{font-size:1em;}
.kiyaku_modal ol.num.caption > li{font-size:1em;}
.kiyaku_modal .dl_blk > dl{}
.kiyaku_modal .dl_blk > dl > dt{width:5em;font-size:1em;}

@media screen and (min-width: 751px) {




.sp{display:none!important;}

}


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


.pc{display:none!important;}

section{width:90vw;margin:0 auto;}
.page_login_form,
.req_regist_member{width:100%;}

.page_login_form .btn.login{font-size:1.25rem;width:9em;}

.input_regist dl{display:block;}
.input_regist dl dt{width:100%;border-right:0px;border-bottom:2px solid #FFF;padding:0.5rem;}
}