@charset "utf-8";
#pageTitle{background-image:url(../img/onlinemeeting/page_title.jpg)}
#pageTitle h2:after{content:"ONLINE MEETING"}
#aboutOnlinemeeting{text-align:center;}
#under main h4{display:flex;color:#333;letter-spacing:0.05em;line-height:1.2em;border:none;padding:0;font-weight:bold}
h4:before{content:"";background:#11347c;margin-right:.7em}
#meritList li{text-align:left;}
#meritList h5{font-weight:bold;}
#itemList p{text-align:left}
.appointmentForm dt{font-weight:bold}
.appointmentForm input[type="text"],.appointmentForm textarea,.appointmentForm input[type="email"],.appointmentForm input[type="tel"],.appointmentForm input[type="number"]{border:1px solid #dbdbdb;}
.appointmentForm select{border:1px solid #dbdbdb}
.appointmentForm input[type="submit"],.btnSend,#mfp_button_send{display:block;text-align:center;font-weight:bold;color:#fff;background:url(../img/onlinemeeting/btn_submit.png) no-repeat center / cover;border:none;}
.appointmentForm input[type="submit"]:before,.btnSend:before{content:"";background:url(../img/onlinemeeting/icon_mail.png) no-repeat center / cover;display:block}
#onSkype{background-image:url(../img/onlinemeeting/logo_skype.gif);background-repeat:no-repeat;}
table#mfp_confirm_table tr th,
table#mfp_confirm_table tr td{background:none}
#mfp_phase_confirm_inner h5{font-weight:bold}
.appointmentForm input[type="number"].zip{text-align:left !important}
@media screen and (min-width:961px){
main section{width:1080px;margin:0 auto}
#aboutOnlinemeeting{margin-top:-4px;}
#under main p{font-size:0.937rem;margin:0 0 1.6em;line-height:1.8em;}
#under main h4{font-size:22px;margin:70px auto 30px;}
h4:before{width:3px;height:25px;}
#meritList{padding-top:1px;}
#meritList h5{font-size:18px;margin-bottom:1em;}
#meritList ul{display:flex;justify-content:space-between;max-width:1080px;margin:0 auto 50px;}
#meritList li{border:4px solid #d2ecf7;width:50%;padding:36px}
#meritList li img{margin:0 auto 30px;}
#meritList li:nth-child(2){margin-left:40px;}
#meritList li p{font-size:0.937rem;margin:0;line-height:1.8em;}
#itemList{margin-bottom:110px;overflow:hidden}
#itemList img{float:right;margin:0 0 0 40px;}
.appointmentForm,.mfp_buttons{padding:30px 0 0;margin-bottom:100px;}
.appointmentForm dl{display:grid;grid-template-columns:33% 67%;-ms-grid-columns:33% 67%;border:3px solid #e7eaf2;font-size:14px;margin:0 auto 40px;}
.appointmentForm dt,.appointmentForm dd{border-bottom:1px solid #e7eaf2}
.appointmentForm dt{text-align:center;border-right:1px solid #e7eaf2;padding:27px 0}
.appointmentForm dd{padding:15px 20px 10px;}
.appointmentForm input[type="text"],.appointmentForm textarea,.appointmentForm input[type="email"],.appointmentForm input[type="tel"],.appointmentForm input[type="number"]{padding:5px;width:90%}
.appointmentForm select{padding:5px;}
.appointmentForm input[type="submit"],.btnSend,#mfp_button_send{width:240px;margin:0 auto;height:50px;font-size:15px;padding:3px 0 0 20px;cursor:pointer;}
.appointmentForm input[type="submit"]:hover,.btnSend:hover,#mfp_button_send:hover{opacity:.7}
#onSkype{padding:0 0 0 264px;;min-height:169px;margin-bottom:170px;}
#onSkype strong{font-size:22px;padding-top:5px;}
.appointmentForm textarea{width:90%;height:160px}
.form-pref{margin:10px 0;}
.appointmentForm input[type="number"].zip{width:120px !important;}
.selectdatetime li{display:inline-block}
table#mfp_confirm_table{border:3px solid #e7eaf2;font-size:14px;margin:0 auto 40px;}
table#mfp_confirm_table tr th,
table#mfp_confirm_table tr td{border-bottom:1px solid #e7eaf2;padding:15px 20px 10px;}
#mfp_phase_confirm_inner h5{margin:0 0 2em}
#mfp_button_cancel{margin-top:20px;border:1px solid #ccc;background:#eee;}
}
/*
    SP 

**********************************************************/

@media screen and (max-width: 960px) {
#aboutOnlinemeeting{margin-top:-4px;}
#aboutOnlinemeeting p {text-align:left}
#aboutOnlinemeeting p br{display:none}
#under main p{font-size:1.25em;margin:0 0 1.6em;line-height:1.8em;}
#under main h4{font-size:1.5rem;margin:30px auto 15px;}
h4:before{width:2px;height:18px;}
#meritList{padding-top:1px;}
#meritList h5{font-size:1.25rem;margin-bottom:1em;text-align:center}
#meritList ul{margin:0 auto 20px;}
#meritList li{border:2px solid #d2ecf7;padding:15px;margin:0 auto 10px}
#meritList li img{margin:0 auto 20px;}
#meritList li p{margin:0;line-height:1.8em;}
#itemList{overflow:hidden;margin:0 auto 20px;}
#itemList img{margin:0 auto 20px;}
.appointmentForm,.mfp_buttons{padding:10px 0 0;margin-bottom:50px;}
.appointmentForm dl{border:2px solid #e7eaf2;margin:0 auto 20px;font-size:14px;}
.appointmentForm dt,.appointmentForm dd{}
.appointmentForm dt{padding:15px 10px 5px}
.appointmentForm dd{padding:5px 10px 15px;border-bottom:1px solid #e7eaf2}
.appointmentForm input[type="text"],.appointmentForm input[type="email"],.appointmentForm input[type="tel"],.appointmentForm textarea{padding:5px;width:100%;}
.appointmentForm input[type="submit"],.btnSend,#mfp_button_send{width:240px;margin:0 auto;height:50px;font-size:15px;padding:3px 0 0 20px;cursor:pointer;}
.appointmentForm textarea{width:100%;height:100px}
.selectdatetime li select{width:50%;padding:5px;}
#onSkype{font-size:0.875rem;text-align:center;padding:100px 0 0;background-position:top center;background-size:auto 80px;}
#onSkype strong{font-size:1.25rem;padding-top:5px;}
.form-pref{margin:10px 0;width:90%;padding:5px;}
.appointmentForm input[type="number"].zip{width:120px;padding:5px;}
.selectdatetime li{display:block;margin-bottom:10px;}
.selectdatetime li:last-child{margin-bottom:0}
table#mfp_confirm_table{border:2px solid #e7eaf2;font-size:14px;margin:0 auto 40px;}
table#mfp_confirm_table tr th,table#mfp_confirm_table tr td{background:#fff !important;display:block}
table#mfp_confirm_table tr th{font-weight:bold;padding:15px 10px 10px;}
table#mfp_confirm_table tr td{padding:10px 10px 15px;border-bottom:1px solid #e7eaf2;}
#mfp_phase_confirm_inner h5{margin:0 0 2em}
#mfp_button_cancel{margin-top:20px;border:1px solid #ccc;background:#eee;}
}