@charset "UTF-8";

/* contact
----------------------------------------------- */

/* form
----------------------------------------------- */
.formbox {margin: 0 auto; }
.formbox table {width: 100%;}
.formbox .mailformproTable th{display: block;width: 100%;font-size: 3.6vw;padding: 0;margin: 6% 0 4%;}
.formbox .mailformproTable td{display: block;width: 100%;padding: 0;font-size: 3.4vw;}
#mfp_buttons{width: 100%!important;}
.formbox input{width: 100%!important;}
.formbox textarea.w100 {width:100% !important;height: 150px !important;border: 1px solid #ddd;}
input[type="submit"] {background:none;border:none;font-size: 4vw;color: #fff;line-height: 2.4;font-weight: bold;font-style: normal;}
form#mailformpro input.time-box { margin-bottom:2%; width: 100%;vertical-align: middle;}

.formbox ul.select li {width: 100%;}
.formbox ul.select li:first-child { margin-bottom: 2%;}

.formbox .contact-att {font-size: 88%;background: #f5f5f5;padding: 4%;width: 100%; }
.formbox .contact-att span.bold { display: block; font-weight: bold; }
.formbox .contact-att span.red {font-weight: bold;padding: 1px 2px;}
.formbox .contact-att-voice{margin-top: 3%;}
.privacy-in{padding: 0;border: 1px solid #eee;border-radius:5px;margin: 10px auto;}
.privacy-in iframe { width:100%;}

.submit {margin: 3% auto 0;color: #fff;display: block;position: relative;width: 100%;text-align: center;height: 64px;padding: 1px;-webkit-transition: all 0.3s ease;transition: all 0.3s ease;font-size: 4vw;font-feature-settings: "palt";letter-spacing: .04em;font-weight: 600;background: #5e5e5e;border-radius: 70px;}
.submit:after {content: "\f105";font-family: 'icon';color: #fff;position: absolute;right: 16px;top:50%;transform: translateY(-50%);font-size: 5vw;line-height: 1.8;}
form#mailformpro .submit input{font-size: 4vw;cursor: pointer;}
form#mailformpro .submit:hover{opacity: 0.8;}

form#mailformpro .con_select-box li{width: 100%;}

form#mailformpro .con_select{width: 100%;position: relative;color: #858585;}
form#mailformpro .con_select select{display: block;width: 100%;cursor: pointer;text-overflow: ellipsis;border: none;border-bottom: 1px solid #ddd;outline: none;background: transparent;background-image: none;box-shadow: none;-webkit-appearance: none;padding: 12px 8px;color: #898a95;}
form#mailformpro .con_select:before{content: "\f107";font-size: 1.2rem;font-family: 'icon';display: inline-block;color: #898a95;position: absolute;right: 4%;top: 50%;-webkit-transform: translate(0, -50%);transform: translate(0, -50%);}
form#mailformpro .birth_y{width: 35%;display: inline-block;}
form#mailformpro .birth_m{width: 20%;display: inline-block;margin-left: 3vw;}
form#mailformpro .birth_d{width: 18%;display: inline-block;margin-left: 3vw;}

/* radio01 */
.mailformproTable td li.long{width: 100%;}
input[type=radio] {display: none;}
.radio01 {box-sizing: border-box;cursor: pointer; display: inline-block;padding-left: 28px; position: relative;width: auto;}
.radio01::before {border: 1px solid #9f9f9f; border-radius: 50%;content: '';display: block; height: 16px; left: 5px; margin-top: -8px; position: absolute;  top: 50%;width: 16px;}
.radio01::after {background: var(--pink);border-radius: 50%;content: '';display: block;height: 10px;left: 8px;margin-top: -5px;opacity: 0;position: absolute;top: 50%;width: 10px;}
input[type=radio]:checked ~ .radio01::after{ opacity: 1;}

/* checkbox01 */
input[type=checkbox] {display: none;}
.checkbox01 { box-sizing: border-box;  cursor: pointer;  display: inline-block;  padding-left: 30px;  position: relative;  width: auto;}
.checkbox01::before { border: 1px solid #9f9f9f; content: ''; display: block; height: 16px;left: 5px;margin-top: -8px;  position: absolute; top: 50%;width: 16px;}
.checkbox01::after {border-right: 3px solid #9e8f8f;border-bottom: 3px solid #9e8f8f; content: ''; display: block; height: 9px;left: 11px;margin-top: -7px; opacity: 0; position: absolute; top: 51%;transform: rotate(45deg);width: 5px;}
input[type=checkbox]:checked ~ .checkbox01::after {  opacity: 1;}
form#mailformpro .check_inline{display: -webkit-flex;display: flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-align-items: center;align-items: baseline;-webkit-flex-wrap: wrap;flex-wrap: wrap;}
form#mailformpro .check_inline li{width: 50%;margin-bottom: 2%;}

select#wkSelect{position: relative;}
button#wkSelect_ms {width: 100%!important; border: 1px solid #e1e1e1!important;padding: 10px;color: #858585;}
.ui-multiselect-menu.ui-widget.ui-widget-content.ui-corner-all{width: 90%!important;left: 5vw!important;}
label.ui-corner-all input[type=checkbox]{display: inline;}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover{padding: 0;}

.use-time td{border-bottom: 1px solid #ddd;padding-bottom: 4vw;}
.use-time ul{margin-bottom: 4vw;}

form#mailformpro input.time-box {width: 49%!important;}
.privacy-in{padding: 6%;}







/* =============================================
pc-size 
================================================*/
@media screen and (min-width: 736px) { 

/* contact
----------------------------------------------- */
.intro-text p{text-align: center;}

/* form
----------------------------------------------- */
.formbox { margin-top: 50px;}
.formbox .mailformproTable th,.formbox .mailformproTable td{display: table-cell;padding: 14px;font-size: 14px;}
.formbox .mailformproTable th{width: 24%;}
.formbox ul.select {display:-webkit-box; display:-moz-box; display:box; display:-webkit-flex; display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;}
.formbox ul.select li {list-style: none;width: 49%;}
.formbox ul.select li:first-child { margin-bottom:0;}
input[type="submit"] { font-size:16px; }
.formbox .mailformproTable td.flex{ display: -webkit-box;display: -moz-box;display: box;display: -webkit-flex;display: flex;flex-wrap: wrap;align-items: flex-start;justify-content: space-between;}
.formbox .contact-att {padding: 16px;margin-bottom: 0;}
.formbox .contact-att-voice{margin-top: 12px;}
.submit {width: 400px;font-size: 17px;}
.submit:after {font-size: 20px;}
form#mailformpro .submit input{font-size: 16px;}
	
form#mailformpro .birth_y{width: 220px;display: inline-block;}
form#mailformpro .birth_m{width: 180px;margin-left: 30px;}
form#mailformpro .birth_d{width: 180px;margin-left: 30px;}
	
.use-time ul{margin-bottom: 6px;}
.privacy-in{padding: 20px;}

}