@charset "utf-8";
/*@import "https://use.typekit.net/qmv1ead.css";*/
@import "font-awesome.min.css";
@import "open-sans-font.css";
@import "noto-sans-font.css";
/* Global */
:root{
    --red:255,0,0;
    --orange:255,102,0;
    --green:0,204,0;
    --gray:85,85,85;
    --black:50,50,50;
    --ycyw-blue:0,50,160;
    --ycyw-navy:0,30,96;
    --yc-red:255,0,68;
    --yw-orange:255,130,0;
    --bs-color-ycywblue:rgba(var(--ycyw-blue),1);
    --bs-color-ycred:rgba(var(--yc-red),1);
    --bs-color-yworange:rgba(var(--yw-orange),1);
    --bs-color-red:rgba(var(--red),1);
    --bs-color-orange:rgba(var(--orange),1);    
    --bs-color-green:rgba(var(--green),1);
    --bs-color-gray:rgba(var(--gray),1);
    --bs-color-black:rgba(var(--black),1);
    --bs-bg-gray:#e3e3e6;
	--bs-body-bg:#f7f7fa;
    --pri-btn-hove-bg:0,72,232;
    --link-color-blue:#0031e5;
    --link-color-ycred:rgba(var(--yc-red),1);
    --link-color-orange:rgba(var(--orange),1);
    --bs-font-family:Tahoma, 'Open Sans', sans-serif, 'Noto Sans SC';
    --bs-font-size:14px;
    --bs-font-weight:400;
}

*{margin:0; padding:0;}
html, body, form{height:100%; background-color:var(--bs-body-bg); scrollbar-width:thin;}
::-webkit-scrollbar {width:6px; height:6px; background: transparent;}
::-webkit-scrollbar-thumb {background-color:rgba(0,0,0,0.2); box-shadow:none;}
::-webkit-scrollbar-thumb:hover{background-color:rgba(0,0,0,0.5);}
::-webkit-scrollbar-track {background: rgba(0,0,0,0.1);}
html, body, table, input, select, textarea, button{font-family:var(--bs-font-family), "Segoe UI", SegoeUI, 'Microsoft YaHei', '微软雅黑', SimHei, '黑体'; font-stretch:wider; font-size:var(--bs-font-size); color:var(--bs-color-gray, #555); font-weight:var(--bs-font-weight);}
input, button, select, textarea, a{outline:none;}
input, button, textarea, select {appearance: none; -moz-appearance: none; -webkit-appearance: none; outline:none;}
input[type=date], input[type=time]{-webkit-appearance:textfield; -moz-appearance:textfield;}
select{background-color:#fff;}
textarea{resize:none;}
li{list-style:none;}
img{border:0;}
a{color:var(--link-color-blue); cursor:pointer;}
a:hover{text-decoration:underline; color:#f60;}
::placeholder{color:#a9a9a9;}
.clearThis:after {display:block; height:0; content:"."; clear:both; visibility:hidden;}
.clear{clear:both;}
.blue{color:#06f;}
.red{color:#f00;}
.green{color:#0c0;}
.red-star{color:#f00; font-family:"宋体"; font-weight:normal; font-style:normal;}
.blackStar{color:#555; font-family:"宋体"; font-weight:normal; font-style:normal;}
.nowrap{white-space:nowrap!important; word-break:keep-all!important;}
.input-tacc{display: none; line-height: 1; padding-top:6px;}
.error, .error .input-tacc, .error.input-tacc{color:#f00; font-weight:normal; display: initial;}
.splitLine{margin:15px auto; position: relative; line-height:1;}
.splitLine::after{content:" "; position: absolute; width: 100%; height:1px; border-bottom: 1px #ddd solid; left:0; top:0;}

/* 自定 Radio Button & CheckBox*/
/* Radio Button */
input[type=checkbox], input[type=radio]{vertical-align:-10%!important; margin:0; margin-right: 5px; clip:rect(0, 0, 0, 0); display:none;}
input + label, label > input + span{margin-right:15px; word-break:keep-all; display:inline-block; line-height:1.6em; position: relative; padding-left:20px;}
td > label:last-child{margin-right:0;}
input[type=radio] + label::before, .radio-label > input[type=radio] + span::before{content: ""; position:absolute; left:0; top:4px; width: 14px; height:14px; flex:0 0 14px; border-radius: 50%; border:1px #999 solid; background-color:#fff; box-sizing: border-box; margin-right:6px;}
input[type=radio]:checked + label::before, .radio-label > input[type=radio]:checked + span::before{background-color: #3f9bff; border-color:#3f9bff; background-clip: content-box; padding:3px;}

/* CheckBox */
input[type=checkbox] + label::before, .checked-label > input[type=checkbox] + span::before{content: "\f00c"; font-family:'FontAwesome'; position:absolute; left:0; top:4px; width:14px; height:14px; font-size: 0.8rem; line-height: 12px; text-align: center; border-radius: 2px; border:1px #999 solid; box-sizing: border-box; background: #fff; color:#fff; margin-right:6px;}
input[type=checkbox]:checked + label::before, .checked-label > input[type=checkbox]:checked + span::before{color:#3f9bff; border-color:#3f9bff;}
input[type=radio]:not(:disabled) + label:hover::before, input[type=checkbox]:not(:disabled) + label:hover::before, label > input[type=radio]:not(:disabled) + span:hover::before, label > input[type=checkbox]:not(:disabled) + span:hover::before{box-shadow: 0 0 6px #3f9bff; border-color:#3f9bff;}

input + label:empty, input + label:empty::before, label > input + span:empty, label > input + span:empty::before{margin-left: 0; margin-right: 0!important;}
input + label:empty::before, label > input + span:empty::before{top:0.6em;}
.long input + label, .long label > input + span, input + label.long, label.long > input + span{align-content:start; align-items:start; line-height:1.5;}
.long input + label::before, .long label > input + span::before, input + label.long::before, label.long > input + span::before{margin-top:3px;}

/* Radio Button & Check Box "Disabled" */
/* Input Not Checked - Label */
input[type=radio]:not(:checked):disabled + label, input[type=radio]:not(:checked).DisabledClass + label, label > input[type=radio]:not(:checked):disabled + span, label > input[type=radio]:not(:checked).disabled + span, label > input[type=radio]:not(:checked).DisabledClass + span,
input[type=checkbox]:not(:checked):disabled + label, input[type=checkbox]:not(:checked).DisabledClass + label, label > input[type=checkbox]:not(:checked):disabled + span, label > input[type=checkbox]:not(:checked).disabled + span, label > input[type=checkbox]:not(:checked).DisabledClass + span{color:#999;}
/* Input Not Checked*/
input[type=radio]:disabled + label::before, input[type=radio].disabled + label::before, input[type=radio].DisabledClass + label::before, input[type=checkbox]:disabled + label::before, input[type=checkbox].disabled + label::before, input[type=checkbox].DisabledClass + label::before,
label > input[type=radio]:disabled + span::before, label > input[type=radio].disabled + span::before, label > input[type=radio].DisabledClass + span::before, label > input[type=checkbox]:disabled + span::before, label > input[type=checkbox].disabled + span::before, label > input[type=checkbox].DisabledClass + span::before{background-color:#f2f2f2; color:#f2f2f2; border-color:#ccc; padding:0;}
input[type=radio]:disabled:hover + label::before, input[type=radio].disabled:hover + label::before, input[type=radio].DisabledClass:hover + label::before, input[type=checkbox]:disabled:hover + label::before, input[type=checkbox].disabled:hover + label::before, input[type=checkbox].DisabledClass:hover + label::before,
label > input[type=radio]:disabled:hover + span::before, label > input[type=radio].disabled:hover + span::before, label > input[type=radio].DisabledClass:hover + span::before, label > input[type=checkbox]:disabled:hover + span::before, label > input[type=checkbox].disabled:hover + span::before, label > input[type=checkbox].DisabledClass:hover + span::before{box-shadow:none;}
/* Input Checked */
input[type=radio]:checked:disabled + label::before, label > input[type=radio]:checked:disabled + span::before{background-color: #999; border-color:#999; background-clip: content-box; padding:3px;}
input[type=checkbox]:checked:disabled + label::before, label > input[type=checkbox]:checked:disabled + span::before{color:#999; border-color:#999; background-color:#fff;}

/* Radio Button 和 Check Box 在 "Disabled" 状态下只显示选中项且不显示 input 自身 */
input[type=radio]:not(:checked):disabled + label, input[type=radio]:not(:checked).disabled + label, input[type=radio]:not(:checked).DisabledClass + label, input[type=checkbox]:not(:checked):disabled + label, input[type=checkbox]:not(:checked).disabled + label, input[type=checkbox]:not(:checked).DisabledClass + label, input[type=radio]:disabled + label::before, input[type=radio].disabled + label::before, input[type=radio].DisabledClass + label::before, input[type=checkbox]:disabled + label::before, input[type=checkbox].disabled + label::before, input[type=checkbox].DisabledClass + label::before,
label > input[type=radio]:not(:checked):disabled + span, label > input[type=radio]:not(:checked).disabled + span, label > input[type=radio]:not(:checked).DisabledClass + span, label > input[type=checkbox]:not(:checked):disabled + span, label > input[type=checkbox]:not(:checked).disabled + span, label > input[type=checkbox]:not(:checked).DisabledClass + span, label > input[type=radio]:disabled + span::before, label > input[type=radio].disabled + span::before, label > input[type=radio].DisabledClass + span::before, label > input[type=checkbox]:disabled + span::before, label > input[type=checkbox].disabled + span::before, label > input[type=checkbox].DisabledClass + span::before{display:none;}

input[type=radio]:checked:disabled + label, input[type=radio]:checked.disabled + label, input[type=radio]:checked.DisabledClass + label, input[type=checkbox]:checked:disabled + label, input[type=checkbox]:checked.disabled + label, input[type=checkbox]:checked.DisabledClass + label,
label > input[type=radio]:checked:disabled + span, label > input[type=radio]:checked.disabled + span, label > input[type=radio]:checked.DisabledClass + span, label > input[type=checkbox]:checked:disabled + span, label > input[type=checkbox]:checked.disabled + span, label > input[type=checkbox]:checked.DisabledClass + span{padding-left:0;}

/* 特殊情况下显示未选中和 "Disabled" 状态表单元素 */
.show input[type=text]:disabled, .show input[type=password]:disabled, .show input[type=date]:disabled, .show select:disabled, .show textarea:disabled {border:1px #ddd solid!important; background-color:#f8f8f8!important; padding-left:3px!important; padding-right: 3px!important; color:#333; opacity:0.9;}
.show select:disabled{background-image: url(../images/style/select-bg-4.svg)!important; background-position: right!important; background-repeat: no-repeat!important; min-width:50px!important; box-sizing:border-box!important; padding-right:20px!important;}
.show input[type=radio]:not(:checked):disabled + label, .show input[type=checkbox]:not(:checked):disabled + label, .show input[type=radio]:disabled + label::before, .show input[type=checkbox]:disabled + label::before,
.show label > input[type=radio]:not(:checked):disabled + span, .show label > input[type=checkbox]:not(:checked):disabled + span, .show label > input[type=radio]:disabled + span::before, .show label > input[type=checkbox]:disabled + span::before{display:inline-block!important;}

.show input[type=radio]:checked:disabled + label, .show input[type=radio]:checked.disabled + label, .show input[type=radio]:checked.DisabledClass + label, .show input[type=checkbox]:checked:disabled + label, .show input[type=checkbox]:checked.disabled + label, .show input[type=checkbox]:checked.DisabledClass + label,
.show label > input[type=radio]:checked:disabled + span, .show label > input[type=radio]:checked.disabled + span, .show label > input[type=radio]:checked.DisabledClass + span, .show label > input[type=checkbox]:checked:disabled + span, .show label > input[type=checkbox]:checked.disabled + span, .show label > input[type=checkbox]:checked.DisabledClass + span{padding-left:20px;}

/* Raido Button、Check Button - 按钮 */
.raido-btn input + label{display:inline-block; height:32px; line-height:30px; border:1px #ddd solid; border-radius:5px; padding:0 15px; box-sizing:border-box; background:#fff; margin-top:5px; margin-bottom:5px;}
.raido-btn input + label:last-child{margin-right:0;}
.raido-btn input + label:hover{background:#effbff;}
.raido-btn input + label::before, .raido-btn input + label:hover::before{display:none;}
input[type=radio]:checked + label{border-color:#4a78df;/* background:#5887f0; color:#fff; font-weight:bold;*/}
/*input[type=radio]:checked + label::after{content:"\f00c"; font-family:FontAwesome; padding-left:15px;}*/


/* 模拟 Select */
.simulation-select{position:relative;}
.simulation-select input[type=text]{width:100%; box-sizing:border-box; padding-right:20px; background-image: url(../images/style/select-bg-1.svg); background-position: right; background-repeat: no-repeat; }
.simulation-select input[type=text]:hover{background-image: url(../images/style/select-bg-2.svg);}
.simulation-select input[type=text].error{background-image: url(../images/style/select-bg-3.svg);}
.simulation-option{border:1px #80bdff solid; border-radius:3px; background:#fff; max-height:196px; overflow:hidden; position:absolute; top:26px; padding:5px 0; left:0; right:0; z-index:100; box-shadow:0 0 5px rgba(127,190,249,0.5) inset!important; display:none;}
.simulation-option > span{display:block!important; margin-bottom:16px; max-height:180px; overflow:auto;}
.simulation-option > span > label{display:block; margin-right:0; padding-left:25px;}
.simulation-option > span > label::before{left:5px;}
.simulation-option > span >  label:hover{background:#4bafff; color:#fff;}
.simulation-option > span >  label + br{display:none;}
.simulation-select-tools{position:absolute; left:0; right:0; bottom:0;}
.simulation-select-tools > label{display:flex; height:16px; text-align:center; background:#f0f2f8; z-index:10;}
.simulation-select-tools > label > span{flex:0 0 50%; cursor:pointer; overflow:hidden; background:url(../images/style/close-select.png) center no-repeat; text-indent:-2000px;}
.simulation-select-tools > label > span:hover{background-color:#ffdcdc;}
.simulation-select-tools > label > .btn-close{background-position:center 0;}
.simulation-select-tools > label > .btn-close:hover{background-position:center -17px;}
.simulation-select-tools > label > .btn-clear{background-position:center -34px;}
.simulation-select-tools > label > .btn-clear:hover{background-position:center -51px;}
@-moz-document url-prefix(){
.simulation-select input[type=text]{padding-left:7px;}
}

/* Header */
header{height:100px; display:flex; justify-content: space-between; align-content: center; align-items: center; padding:0 60px; color:#0032a1; background:#fff; box-sizing: border-box;}
header a{text-decoration: none; color:var(--bs-color-ycywblue);}
.logo{height:70%;}
.logo a{display:block; height:100%; box-sizing: border-box;}
.logo a img{display:block;height: 100%;}

.language-switch{height:24px; line-height:24px; position: relative; cursor: pointer; display:flex; align-items:center; text-transform:uppercase;}
.language-switch > img{display:inline-block; height:24px; vertical-align: middle; margin-right:10px;}
.language-switch:hover > img{opacity:0.2;}
.lang_dropdown{position: absolute; z-index:10; top:12px; right:-10px; opacity:0; height:0; padding-top:12px; transform: translateY(0); transition: opacity .1s ease-out,transform .1s ease-out; pointer-events:auto; font-size:14px;}
.language-switch:hover .lang_dropdown{height:auto; transform: translateY(6px); opacity:1; pointer-events:auto;}
.lang_dropdown ul{background-color: #fff; border-radius: 4px; box-shadow: 0 6px 32px 0 rgba(130,130,140,.24); overflow: hidden;}
.lang_dropdown li{margin:0!important;}
.lang_dropdown li a{display:flex; align-items:center; padding:10px 15px; text-decoration:none; white-space: nowrap;}
.lang_dropdown li a:hover{background:#E9ECEF; color:var(--bs-color-ycred);}
.lang_dropdown li a.is-active{color:var(--bs-color-ycred); font-size:12px; cursor:default;}
.lang_dropdown li a.is-active::after{content: ""; display: inline-block; width: 16px; height: 16px; vertical-align:middle; margin-left: 5px;background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJtMTMuMDE0IDQuODkxLTYuMTY4IDcuNzEzTDIgOC41NjZsLjkxNC0xLjA5NyAzLjcyNiAzLjEwNEwxMS45IDRsMS4xMTQuODkxeiIgZmlsbD0iI0ZGMDEzMSIvPgo8L3N2Zz4K); background-position: 50%; background-size: cover; background-repeat: no-repeat; background-color:none;}

.page-wrap{height:calc(100% - 100px); box-sizing:border-box; padding-left:320px; position:relative; overflow:hidden;}

/* Left Side */
.page-side, .page-side-mask{position:absolute; left:0; top:0; bottom:0; width:320px; background-position:bottom; background-repeat:no-repeat; box-sizing:border-box;}
.page-side{padding:50px; color:#fff; background-color:#002d98; background-image:url(../Images/OnlineEnquiry/online-enquiry_side-bg.webp); background-size:100% auto;}
.page-side-mask{background-image:url(../Images/OnlineEnquiry/online-enquiry_side-mask.png); background-size:100% auto;}
.page-side h2{font-size:24px; margin-bottom:30px; position:relative; z-index:2;}
.menu{position:relative; z-index:2; line-height:1.2;}
.menu::before, .menu li::before{content:""; display:block; width:5px; position:absolute; left:0; top:0; bottom:0; background:rgba(255,255,255,0.8);}
.menu::before{border-radius:5px;}
.menu li:first-child::before{border-radius:5px 5px 0 0;}
.menu li:last-child::before{border-radius:0 0 5px 5px;}
.menu li{height:auto; min-height:40px; box-sizing:border-box; position:relative; display:flex; align-content:center; align-items:center;}
.menu li::before{background:var(--bs-color-ycred); display:none;}
.menu li a{color:rgba(255,255,255,0.6); text-decoration:none; display:block; width:100%; padding:10px 15px 10px 20px; border-radius:0 4px 4px 0; box-sizing:border-box;}
.menu li:hover a{background:rgba(0,0,0,0.1);}
.menu li.is-active a, .menu li.is-ok a{font-size:16px; font-weight:500;}
.menu li.is-active a, .menu li a:hover{color:rgba(255,255,255,1);}
.menu li.is-active::before, .menu li.is-ok::before{display:block;}

/* Form Main */
.main-wrap{height:100%; box-sizing:border-box; margin: 0 auto; padding:50px 100px 0; overflow:auto; scrollbar-width:thin;}
.form-wrap{display: flex; justify-content:space-between; align-items: stretch; align-content: stretch; flex-flow: wrap; box-sizing: border-box;}
.form-item{padding:10px 50px; box-sizing: border-box; flex:0 0 50%;}
.row-100{flex:0 0 100%;}
.ca-label_box{font-weight:600; color:var(--bs-color-ycywblue); margin-bottom:5px;}
.ca-label_box span{padding-right:6px;}
.ca-form{padding-left:0; height:auto;}
.ca-textfield_box, .ca-selectfield_box{width: 100%; background-color:#fff; height:36px; border-radius:4px; position: relative; color:var(--bs-color-black); box-sizing:border-box; display:flex; align-content:center; align-items:center;}
.ca-textfield_box input{height:36px; padding:0 10px; box-sizing: border-box; border:none; background: none; width:100%;}
.ca-textfield_box::after, .ca-selectfield_box::after {content: ''; height:1px; background-color:var(--link-color-blue); position: absolute; left: 45%;  bottom: -1px; transition-duration: .2s; transition-timing-function: cubic-bezier(.4,0,.2,1); width: 10px; opacity: 0;}
.ca-selectfield_box select{position: absolute; height:100%; width: 100%; left:0; opacity:0;}
.ca-selectfield_box > span{position: absolute; left:0; right:20px; bottom:0; top:0; white-space:nowrap; overflow: hidden; text-overflow:ellipsis; box-sizing:border-box; padding:0 10px; display:flex; align-content:center; align-items:center;}
.ca-selectfield_box::before{content:""; display:block; position:absolute; right:10px; width:10px; height:10px; background:var(--bs-color-gray) url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyNi4wLjMsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0i5Zu+5bGCXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMTAgMTAiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDEwIDEwOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPg0KCS5zdDB7ZmlsbDojRkZGRkZGO30NCgkuc3Qxe2ZpbGw6IzIzMTgxNTt9DQo8L3N0eWxlPg0KPHJlY3QgY2xhc3M9InN0MCIgd2lkdGg9IjEwIiBoZWlnaHQ9IjEwIi8+DQo8cG9seWdvbiBjbGFzcz0ic3QxIiBwb2ludHM9IjMuMyw5LjUgMi4yLDguNCA1LjYsNSAyLjIsMS42IDMuMywwLjUgNy44LDUgIi8+DQo8L3N2Zz4NCg==) center no-repeat; background-size:100%; background-blend-mode:screen; transform:rotate(90deg);}

.sub_form-wrap.row-100{display:flex; flex-wrap:wrap;}

fieldset.form-wrap{border:1px rgba(0,50,160,0.6) dashed; border-radius:6px; margin:0 auto 30px; width:calc(100% - 100px); padding:10px 0;}
fieldset.form-wrap legend {font-weight:normal; color:#fff; margin-left:30px; border:none; border-radius:4px; outline:5px var(--bs-body-bg) solid; padding:3px 10px; background:var(--bs-color-ycywblue);}
fieldset.form-wrap .form-item{padding:10px 20px; box-sizing: border-box; flex:0 0 calc(50% - 30px);}

.is-focus .ca-selectfield_box::before, .is-focus.ca-selectfield_box::before,
.is-focus .ca-selectfield_box::after, .is-focus.ca-selectfield_box::after,
.is-focus .ca-textfield_box::after, .is-focus.ca-textfield_box::after
{background-color:var(--link-color-blue);}
.is-focus .ca-textfield_box::after, .is-focus.ca-textfield_box::after, .is-focus .ca-selectfield_box::after, .is-focus.ca-selectfield_box::after,
.error .ca-textfield_box::after, .error.ca-textfield_box::after, .error .ca-selectfield_box::after, .error.ca-selectfield_box::after
{width:100%; left:0; opacity: 1;}
.error .ca-textfield_box, .error.ca-textfield_box, .error .ca-selectfield_box, .error.ca-selectfield_box{border-bottom:none;}
.error.is-focus .ca-textfield_box, .error.is-focus.ca-textfield_box, .error.is-focus .ca-selectfield_box, .error.is-focus.ca-selectfield_box{border-bottom:none;}
.error .ca-selectfield_box::before, .error.ca-selectfield_box::before,
.error .ca-selectfield_box::after, .error.ca-selectfield_box::after,
.error .ca-textfield_box::after, .error.ca-textfield_box::after
{background-color:var(--bs-color-red);}
.form-wrap .splitLine{flex:0 0 calc(100% - 100px); margin-bottom:20px;}
.ca-form textarea{height:100px; box-sizing:border-box; padding:10px; border:none; border-radius:4px;}
.ca-form textarea:focus{border:1px var(--link-color-blue) solid;}
.vcode-img{position:absolute; right:5px; width:auto; height:26px;}
.vcode-img img{display: block; height:100%;}

.sel-btn_item{display:inline-flex; align-content:center; align-items:center; margin:5px 0 0;}
.sel-btn_item img.icon{width:20px; height:20px; vertical-align:middle; margin-right:10px; opacity:0.3;}
.sel-btn_item .radio-label > input + span{padding:10px 15px; border:1px #ddd solid; background-color:#fff; color:#333; border-radius:4px; font-weight:500; cursor:pointer;}
.sel-btn_item:hover .radio-label > input + span{color:var(--bs-color-ycywblue); border:1px rgba(14,118,231,0.3) solid;}
.sel-btn_item:hover img.icon{opacity:0.75;}
.sel-btn_item .radio-label > input:checked + span{color:var(--bs-color-ycywblue); border:1px rgba(14,118,231,0.3) solid; font-weight:900; cursor:default;}
.sel-btn_item .radio-label > input:checked + span::after{content:""; display:inline-block; vertical-align:middle; height:20px; width:20px; margin-left:10px; background-color:var(--bs-color-ycred); background-image:url('../Images/icon-checked.svg'); background-size:100%; background-blend-mode:screen;}
.sel-btn_item .radio-label > input:checked + span img{opacity:1;}
.sel-btn_item .radio-label > input + span::before{display:none;}

.add-text-box{color:var(--bs-color-ycywblue); padding:0 50px; margin-bottom:20px;}

table.datelist{margin-left:15px;}
.datelist td, .datelist-item td{padding:3px 10px 3px 0;}
.datelist td >  input[type=radio], .datelist-item td input[type=checkbox]{margin-right:10px;}

/*.datelist .qTitle{font-size:var(--bs-font-size); font-weight:500; color:var(--bs-color-ycywblue); margin-bottom:5px;}
.dlList{padding-left:12px;}
.dlList dt, .dlList dd{padding:5px 0;}
.dlList dt > span{font-weight:bold;}
.dlList dd, .dlList dd ul{padding-left:20px;}
.dlList input[type=text]{height:18px; width:160px; border:none; background:none; margin-left:-10px; background:#fff;}
.dlList input[type=text]:focus{ border-bottom:1px var(--link-color-blue) solid;}*/


/* Button */
/* Gendral Button */
.btn{display:inline-flex; align-items: center; justify-content: center; background-color:#F0F5FC; padding: 11px 15px; min-width: 160px; border: none; border-radius:4px; overflow: hidden; text-decoration: none!important;/* box-shadow: 0 2px 6px rgb(130 130 140 / 12%);*/ position: relative; z-index: 1; white-space: nowrap; cursor:pointer;}
.btn::before, .btn.disabled::before, .btn[disabled]::before {content: ""; display: block; background-color:#C1CEDE; position: absolute; width: 200%; height: 500%; left: 50%; top: 50%; transform: translate(-50%,-50%); transition: all .3s ease-in-out; z-index: -1; -webkit-clip-path: circle(100% at -80% 90%); clip-path: circle(100% at -80% 90%);}
.btn:hover::before{-webkit-clip-path: circle(100% at 50% 50%); clip-path: circle(100% at 50% 50%);}
.btn-text{font-size: 14px; font-weight: 500; line-height: 1.285; letter-spacing: .04em; color:var(--bs-color-ycywblue); transition: color .3s ease-in-out; text-transform:uppercase;}
.btn-icon{width: 18px; height: 18px; border-radius: 50%; overflow: hidden; background-color:var(--bs-color-ycywblue); position: relative; margin-left: 7px; transition: background-color .3s ease-in-out;}
.btn-icon::after, .btn-icon::before{content: ""; width: 6px; height: 9px; position: absolute; top: 50%; left: 55%; background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgNiA5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMC4yMzUxOTYgNy42MjA3OUwzLjM2MDE4IDQuNDk1OEwwLjIzNTE5NiAxLjM3MDgyQzAuMTYwNjMgMS4yOTYyNSAwLjEwMTQ4MSAxLjIwNzczIDAuMDYxMTI1OSAxLjExMDMxQzAuMDIwNzcxIDEuMDEyODggMS41NzEzN2UtMDkgMC45MDg0NiAwIDAuODAzMDA4Qy0xLjU3MTM2ZS0wOSAwLjY5NzU1NSAwLjAyMDc3MSAwLjU5MzEzNSAwLjA2MTEyNTkgMC40OTU3MUMwLjEwMTQ4MSAwLjM5ODI4NSAwLjE2MDYzIDAuMzA5NzYyIDAuMjM1MTk2IDAuMjM1MTk1QzAuMzA5NzYyIDAuMTYwNjI5IDAuMzk4Mjg1IDAuMTAxNDggMC40OTU3MSAwLjA2MTEyNTFDMC41OTMxMzYgMC4wMjA3NzAyIDAuNjk3NTU2IC0xLjU3MTM3ZS0wOSAwLjgwMzAwOCAwQzAuOTA4NDYxIDEuNTcxMzdlLTA5IDEuMDEyODggMC4wMjA3NzAyIDEuMTEwMzEgMC4wNjExMjUxQzEuMjA3NzMgMC4xMDE0OCAxLjI5NjI1IDAuMTYwNjI5IDEuMzcwODIgMC4yMzUxOTVMNS4wNjc2NCAzLjkzMjAyQzUuMzgxNzUgNC4yNDYxMyA1LjM4MTc1IDQuNzUzNTMgNS4wNjc2NCA1LjA2NzY0TDEuMzcwODIgOC43NjQ0NkMxLjI5NjMxIDguODM5MTMgMS4yMDc4IDguODk4MzYgMS4xMTAzNyA4LjkzODc4QzEuMDEyOTQgOC45NzkyIDAuOTA4NDkxIDkgMC44MDMwMDggOUMwLjY5NzUyNSA5IDAuNTkzMDc4IDguOTc5MiAwLjQ5NTY0NSA4LjkzODc4QzAuMzk4MjEyIDguODk4MzYgMC4zMDk3MDcgOC44MzkxMyAwLjIzNTE5NiA4Ljc2NDQ2Qy0wLjA3MDg1OTEgOC40NTAzNSAtMC4wNzg5MTMyIDcuOTM0ODkgMC4yMzUxOTYgNy42MjA3OVoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=);
    background-position: 50%; background-size: cover; background-repeat: no-repeat; transition: transform .3s ease-in-out;}
.btn-icon::before {transform: translate(-260%,-50%);}
.btn-icon::after {transform: translate(-50%,-50%);}
.btn:hover .btn-icon::before {transform: translate(-50%,-50%);}
.btn:hover .btn-icon::after {transform: translate(150%,-50%);}

/* Main Button */
.btn-primary{background-color:var(--bs-color-ycywblue,#0032a0); color:#fff!important; text-decoration:none!important; cursor:pointer;}
.btn-primary .btn-text{color:#fff;}
.btn-primary .btn-icon{background-color:#fff;}
.btn-primary::before{background-color:rgba(var(--pri-btn-hove-bg),1);}
.btn-primary .btn-icon::after, .btn-primary .btn-icon::before {background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgNiA5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMC4yMzUxOTYgNy42MjA3OUwzLjM2MDE4IDQuNDk1OEwwLjIzNTE5NiAxLjM3MDgyQzAuMTYwNjMgMS4yOTYyNSAwLjEwMTQ4MSAxLjIwNzczIDAuMDYxMTI1OSAxLjExMDMxQzAuMDIwNzcxIDEuMDEyODggMS41NzEzN2UtMDkgMC45MDg0NiAwIDAuODAzMDA4Qy0xLjU3MTM2ZS0wOSAwLjY5NzU1NSAwLjAyMDc3MSAwLjU5MzEzNSAwLjA2MTEyNTkgMC40OTU3MUMwLjEwMTQ4MSAwLjM5ODI4NSAwLjE2MDYzIDAuMzA5NzYyIDAuMjM1MTk2IDAuMjM1MTk1QzAuMzA5NzYyIDAuMTYwNjI5IDAuMzk4Mjg1IDAuMTAxNDggMC40OTU3MSAwLjA2MTEyNTFDMC41OTMxMzYgMC4wMjA3NzAyIDAuNjk3NTU2IC0xLjU3MTM3ZS0wOSAwLjgwMzAwOCAwQzAuOTA4NDYxIDEuNTcxMzdlLTA5IDEuMDEyODggMC4wMjA3NzAyIDEuMTEwMzEgMC4wNjExMjUxQzEuMjA3NzMgMC4xMDE0OCAxLjI5NjI1IDAuMTYwNjI5IDEuMzcwODIgMC4yMzUxOTVMNS4wNjc2NCAzLjkzMjAyQzUuMzgxNzUgNC4yNDYxMyA1LjM4MTc1IDQuNzUzNTMgNS4wNjc2NCA1LjA2NzY0TDEuMzcwODIgOC43NjQ0NkMxLjI5NjMxIDguODM5MTMgMS4yMDc4IDguODk4MzYgMS4xMTAzNyA4LjkzODc4QzEuMDEyOTQgOC45NzkyIDAuOTA4NDkxIDkgMC44MDMwMDggOUMwLjY5NzUyNSA5IDAuNTkzMDc4IDguOTc5MiAwLjQ5NTY0NSA4LjkzODc4QzAuMzk4MjEyIDguODk4MzYgMC4zMDk3MDcgOC44MzkxMyAwLjIzNTE5NiA4Ljc2NDQ2Qy0wLjA3MDg1OTEgOC40NTAzNSAtMC4wNzg5MTMyIDcuOTM0ODkgMC4yMzUxOTYgNy42MjA3OVoiIGZpbGw9IiMwMDFFNjAiLz4KPC9zdmc+Cgo=);
    background-position: 50%; background-size: cover; background-repeat: no-repeat; transition: transform .3s ease-in-out;}
.btn-primary:hover .btn-icon::after, .btn-primary:hover .btn-icon::before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgNiA5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMC4yMzUxOTYgNy42MjA3OUwzLjM2MDE4IDQuNDk1OEwwLjIzNTE5NiAxLjM3MDgyQzAuMTYwNjMgMS4yOTYyNSAwLjEwMTQ4MSAxLjIwNzczIDAuMDYxMTI1OSAxLjExMDMxQzAuMDIwNzcxIDEuMDEyODggMS41NzEzN2UtMDkgMC45MDg0NiAwIDAuODAzMDA4Qy0xLjU3MTM2ZS0wOSAwLjY5NzU1NSAwLjAyMDc3MSAwLjU5MzEzNSAwLjA2MTEyNTkgMC40OTU3MUMwLjEwMTQ4MSAwLjM5ODI4NSAwLjE2MDYzIDAuMzA5NzYyIDAuMjM1MTk2IDAuMjM1MTk1QzAuMzA5NzYyIDAuMTYwNjI5IDAuMzk4Mjg1IDAuMTAxNDggMC40OTU3MSAwLjA2MTEyNTFDMC41OTMxMzYgMC4wMjA3NzAyIDAuNjk3NTU2IC0xLjU3MTM3ZS0wOSAwLjgwMzAwOCAwQzAuOTA4NDYxIDEuNTcxMzdlLTA5IDEuMDEyODggMC4wMjA3NzAyIDEuMTEwMzEgMC4wNjExMjUxQzEuMjA3NzMgMC4xMDE0OCAxLjI5NjI1IDAuMTYwNjI5IDEuMzcwODIgMC4yMzUxOTVMNS4wNjc2NCAzLjkzMjAyQzUuMzgxNzUgNC4yNDYxMyA1LjM4MTc1IDQuNzUzNTMgNS4wNjc2NCA1LjA2NzY0TDEuMzcwODIgOC43NjQ0NkMxLjI5NjMxIDguODM5MTMgMS4yMDc4IDguODk4MzYgMS4xMTAzNyA4LjkzODc4QzEuMDEyOTQgOC45NzkyIDAuOTA4NDkxIDkgMC44MDMwMDggOUMwLjY5NzUyNSA5IDAuNTkzMDc4IDguOTc5MiAwLjQ5NTY0NSA4LjkzODc4QzAuMzk4MjEyIDguODk4MzYgMC4zMDk3MDcgOC44MzkxMyAwLjIzNTE5NiA4Ljc2NDQ2Qy0wLjA3MDg1OTEgOC40NTAzNSAtMC4wNzg5MTMyIDcuOTM0ODkgMC4yMzUxOTYgNy42MjA3OVoiIGZpbGw9IiMwMDQ4RTgiLz4KPC9zdmc+Cgo=);
    background-position: 50%; background-size: cover; background-repeat: no-repeat;
}

/* Button 禁用 */
.btn.disabled, .btn[disabled]{background-color:#e9e9e9; cursor:default; pointer-events:none;}
.btn.disabled::before, .btn[disabled]::before{background-color:#ededed;}
.btn.disabled .btn-text, .btn[disabled] .btn-text{color:#999;}
.btn.disabled .btn-icon, .btn[disabled] .btn-icon{background-color:#fff;}
.btn.disabled .btn-icon::after, .btn[disabled] .btn-icon::before,
.btn.disabled:hover .btn-icon::after, .btn[disabled]:hover .btn-icon::before{content: ""; width: 6px; height: 9px; position: absolute; top: 50%; left: 55%; background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyNi4wLjMsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4yIiBiYXNlUHJvZmlsZT0idGlueSIgaWQ9IuWbvuWxgl8xIg0KCSB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjZweCIgaGVpZ2h0PSI5cHgiDQoJIHZpZXdCb3g9IjAgMCA2IDkiIG92ZXJmbG93PSJ2aXNpYmxlIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiM5OTk5OTkiIGQ9Ik0wLjgsOUMwLjYsOSwwLjQsOC45LDAuMiw4LjhjLTAuMy0wLjMtMC4zLTAuOCwwLTEuMmwzLjEtMy4xTDAuMiwxLjRjLTAuMy0wLjMtMC4zLTAuOCwwLTEuMg0KCWMwLjMtMC4zLDAuOC0wLjMsMS4yLDBsMy45LDMuOWMwLjIsMC4yLDAuMiwwLjUsMCwwLjdMMS40LDguOEMxLjIsOC45LDEsOSwwLjgsOXoiLz4NCjwvc3ZnPg0K);
    background-position: 50%; background-size: cover; background-repeat: no-repeat; transition: transform .3s ease-in-out;}

.btn.is-active{pointer-events:none; background:rgba(var(--pri-btn-hove-bg),1);}
.btn.is-active .btn-icon{background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyNi4yLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4yIiBiYXNlUHJvZmlsZT0idGlueSIgaWQ9IuWbvuWxgl8xIg0KCSB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjIwMHB4IiBoZWlnaHQ9IjIwMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMjAwIDIwMCIgb3ZlcmZsb3c9InZpc2libGUiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHBhdGggZmlsbD0iI0ZGMDA0NCIgZD0iTTExMCwxNjBjMTEsMCwyMCw4LjksMjAsMjBjMCwxMS04LjksMjAtMjAsMjBsMCwwYy0xMSwwLTIwLTktMjAtMjBTOTksMTYwLDExMCwxNjB6IE00Ny40LDEzMA0KCWMxMy44LDAsMjUsMTEuMiwyNSwyNXMtMTEuMiwyNS0yNSwyNXMtMjUtMTEuMi0yNS0yNUMyMi40LDE0MS4yLDMzLjYsMTMwLDQ3LjQsMTMweiBNMTYzLjIsMTM1YzExLDAsMjAsOC45LDIwLDIwDQoJYzAsMTEtOC45LDIwLTIwLDIwbDAsMGMtMTEsMC0yMC05LTIwLTIwUzE1Mi4yLDEzNSwxNjMuMiwxMzV6IE0xODUsOTMuMmM4LjMsMCwxNSw2LjcsMTUsMTVzLTYuNywxNS0xNSwxNWwwLDBjLTguMywwLTE1LTYuNy0xNS0xNQ0KCVMxNzYuNyw5My4yLDE4NSw5My4yeiBNMjUsNjBjMTMuOCwwLDI1LDExLjIsMjUsMjVzLTExLjIsMjUtMjUsMjVTMCw5OC44LDAsODVTMTEuMiw2MCwyNSw2MHogTTE3Ny45LDUyLjFjNS41LDAsMTAsNC41LDEwLDEwDQoJcy00LjUsMTAtMTAsMTBsMCwwYy01LjUsMC0xMC00LjUtMTAtMTBDMTY3LjksNTYuNSwxNzIuMyw1Mi4xLDE3Ny45LDUyLjF6IE04MCwwYzE2LjYsMCwzMCwxMy40LDMwLDMwUzk2LjYsNjAsODAsNjBTNTAsNDYuNiw1MCwzMA0KCVM2My40LDAsODAsMHogTTE1NSwzMGMyLjgsMCw1LDIuMiw1LDVzLTIuMiw1LTUsNWwwLDBjLTIuOCwwLTUtMi4yLTUtNVMxNTIuMiwzMCwxNTUsMzB6Ii8+DQo8L3N2Zz4NCg==);
    background-position:center; background-size:80%; background-repeat: no-repeat;
    -webkit-animation: ycyw-spin 2s infinite linear; animation: ycyw-spin 2s infinite linear; pointer-events:none;}
.btn.is-active .btn-icon::before, .btn.is-active .btn-icon::after{display:none;}

@keyframes ycyw-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}

/* Link Button */
.link-btn{display:flex; flex-wrap:wrap; --link-color:var(--link-color-blue); margin:10px auto;}
.link-btn a, .link-btn button{font-size: 14px; font-weight: 500; line-height: 1.285; letter-spacing: .04em; border: none; background: none; color: var(--link-color); text-decoration: none; display: flex; align-items: center; padding: 0; margin:5px auto;}
.link-btn_icon{width: 18px; height: 18px; border-radius: 50%; overflow: hidden; background-color: var(--link-color); position: relative; margin-left: 7px; flex-shrink: 0;}
.link-btn_icon::after, .link-btn_icon::before {content: ""; width: 6px; height: 9px; position: absolute; top: 50%; left: 55%; background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgNiA5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMC4yMzUxOTYgNy42MjA3OUwzLjM2MDE4IDQuNDk1OEwwLjIzNTE5NiAxLjM3MDgyQzAuMTYwNjMgMS4yOTYyNSAwLjEwMTQ4MSAxLjIwNzczIDAuMDYxMTI1OSAxLjExMDMxQzAuMDIwNzcxIDEuMDEyODggMS41NzEzN2UtMDkgMC45MDg0NiAwIDAuODAzMDA4Qy0xLjU3MTM2ZS0wOSAwLjY5NzU1NSAwLjAyMDc3MSAwLjU5MzEzNSAwLjA2MTEyNTkgMC40OTU3MUMwLjEwMTQ4MSAwLjM5ODI4NSAwLjE2MDYzIDAuMzA5NzYyIDAuMjM1MTk2IDAuMjM1MTk1QzAuMzA5NzYyIDAuMTYwNjI5IDAuMzk4Mjg1IDAuMTAxNDggMC40OTU3MSAwLjA2MTEyNTFDMC41OTMxMzYgMC4wMjA3NzAyIDAuNjk3NTU2IC0xLjU3MTM3ZS0wOSAwLjgwMzAwOCAwQzAuOTA4NDYxIDEuNTcxMzdlLTA5IDEuMDEyODggMC4wMjA3NzAyIDEuMTEwMzEgMC4wNjExMjUxQzEuMjA3NzMgMC4xMDE0OCAxLjI5NjI1IDAuMTYwNjI5IDEuMzcwODIgMC4yMzUxOTVMNS4wNjc2NCAzLjkzMjAyQzUuMzgxNzUgNC4yNDYxMyA1LjM4MTc1IDQuNzUzNTMgNS4wNjc2NCA1LjA2NzY0TDEuMzcwODIgOC43NjQ0NkMxLjI5NjMxIDguODM5MTMgMS4yMDc4IDguODk4MzYgMS4xMTAzNyA4LjkzODc4QzEuMDEyOTQgOC45NzkyIDAuOTA4NDkxIDkgMC44MDMwMDggOUMwLjY5NzUyNSA5IDAuNTkzMDc4IDguOTc5MiAwLjQ5NTY0NSA4LjkzODc4QzAuMzk4MjEyIDguODk4MzYgMC4zMDk3MDcgOC44MzkxMyAwLjIzNTE5NiA4Ljc2NDQ2Qy0wLjA3MDg1OTEgOC40NTAzNSAtMC4wNzg5MTMyIDcuOTM0ODkgMC4yMzUxOTYgNy42MjA3OVoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=);
  background-position: 50%; background-size: cover; background-repeat: no-repeat; transition: transform .3s ease-in-out;}
.link-btn_icon::before {transform: translate(-260%,-50%);}
.link-btn_icon::after {transform: translate(-50%,-50%);}
.link-btn a:hover .link-btn_icon::before, .link-btn button:hover .link-btn_icon::before {transform: translate(-50%,-50%);}
.link-btn a:hover .link-btn_icon::after, .link-btn button:hover .link-btn_icon::after {transform: translate(150%,-50%);}

.link-btn_left{display:block; margin:10px 0;}
.link-btn_white a, .link-btn_white button, .link-btn_white .link-btn_text{color:#fff;}
.link-btn_white .link-btn_icon{background-color:#fff;}
.link-btn_white .link-btn_icon::after, .link-btn_white .link-btn_icon::before {background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgNiA5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMC4yMzUxOTYgNy42MjA3OUwzLjM2MDE4IDQuNDk1OEwwLjIzNTE5NiAxLjM3MDgyQzAuMTYwNjMgMS4yOTYyNSAwLjEwMTQ4MSAxLjIwNzczIDAuMDYxMTI1OSAxLjExMDMxQzAuMDIwNzcxIDEuMDEyODggMS41NzEzN2UtMDkgMC45MDg0NiAwIDAuODAzMDA4Qy0xLjU3MTM2ZS0wOSAwLjY5NzU1NSAwLjAyMDc3MSAwLjU5MzEzNSAwLjA2MTEyNTkgMC40OTU3MUMwLjEwMTQ4MSAwLjM5ODI4NSAwLjE2MDYzIDAuMzA5NzYyIDAuMjM1MTk2IDAuMjM1MTk1QzAuMzA5NzYyIDAuMTYwNjI5IDAuMzk4Mjg1IDAuMTAxNDggMC40OTU3MSAwLjA2MTEyNTFDMC41OTMxMzYgMC4wMjA3NzAyIDAuNjk3NTU2IC0xLjU3MTM3ZS0wOSAwLjgwMzAwOCAwQzAuOTA4NDYxIDEuNTcxMzdlLTA5IDEuMDEyODggMC4wMjA3NzAyIDEuMTEwMzEgMC4wNjExMjUxQzEuMjA3NzMgMC4xMDE0OCAxLjI5NjI1IDAuMTYwNjI5IDEuMzcwODIgMC4yMzUxOTVMNS4wNjc2NCAzLjkzMjAyQzUuMzgxNzUgNC4yNDYxMyA1LjM4MTc1IDQuNzUzNTMgNS4wNjc2NCA1LjA2NzY0TDEuMzcwODIgOC43NjQ0NkMxLjI5NjMxIDguODM5MTMgMS4yMDc4IDguODk4MzYgMS4xMTAzNyA4LjkzODc4QzEuMDEyOTQgOC45NzkyIDAuOTA4NDkxIDkgMC44MDMwMDggOUMwLjY5NzUyNSA5IDAuNTkzMDc4IDguOTc5MiAwLjQ5NTY0NSA4LjkzODc4QzAuMzk4MjEyIDguODk4MzYgMC4zMDk3MDcgOC44MzkxMyAwLjIzNTE5NiA4Ljc2NDQ2Qy0wLjA3MDg1OTEgOC40NTAzNSAtMC4wNzg5MTMyIDcuOTM0ODkgMC4yMzUxOTYgNy42MjA3OVoiIGZpbGw9IiMwMDQ4RTgiLz4KPC9zdmc+Cgo=);
    background-position: 50%; background-size: cover; background-repeat: no-repeat; transition: transform .3s ease-in-out;}
.link-btn_white:hover .link-btn_icon::after, .link-btn_white:hover .link-btn_icon::before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgNiA5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMC4yMzUxOTYgNy42MjA3OUwzLjM2MDE4IDQuNDk1OEwwLjIzNTE5NiAxLjM3MDgyQzAuMTYwNjMgMS4yOTYyNSAwLjEwMTQ4MSAxLjIwNzczIDAuMDYxMTI1OSAxLjExMDMxQzAuMDIwNzcxIDEuMDEyODggMS41NzEzN2UtMDkgMC45MDg0NiAwIDAuODAzMDA4Qy0xLjU3MTM2ZS0wOSAwLjY5NzU1NSAwLjAyMDc3MSAwLjU5MzEzNSAwLjA2MTEyNTkgMC40OTU3MUMwLjEwMTQ4MSAwLjM5ODI4NSAwLjE2MDYzIDAuMzA5NzYyIDAuMjM1MTk2IDAuMjM1MTk1QzAuMzA5NzYyIDAuMTYwNjI5IDAuMzk4Mjg1IDAuMTAxNDggMC40OTU3MSAwLjA2MTEyNTFDMC41OTMxMzYgMC4wMjA3NzAyIDAuNjk3NTU2IC0xLjU3MTM3ZS0wOSAwLjgwMzAwOCAwQzAuOTA4NDYxIDEuNTcxMzdlLTA5IDEuMDEyODggMC4wMjA3NzAyIDEuMTEwMzEgMC4wNjExMjUxQzEuMjA3NzMgMC4xMDE0OCAxLjI5NjI1IDAuMTYwNjI5IDEuMzcwODIgMC4yMzUxOTVMNS4wNjc2NCAzLjkzMjAyQzUuMzgxNzUgNC4yNDYxMyA1LjM4MTc1IDQuNzUzNTMgNS4wNjc2NCA1LjA2NzY0TDEuMzcwODIgOC43NjQ0NkMxLjI5NjMxIDguODM5MTMgMS4yMDc4IDguODk4MzYgMS4xMTAzNyA4LjkzODc4QzEuMDEyOTQgOC45NzkyIDAuOTA4NDkxIDkgMC44MDMwMDggOUMwLjY5NzUyNSA5IDAuNTkzMDc4IDguOTc5MiAwLjQ5NTY0NSA4LjkzODc4QzAuMzk4MjEyIDguODk4MzYgMC4zMDk3MDcgOC44MzkxMyAwLjIzNTE5NiA4Ljc2NDQ2Qy0wLjA3MDg1OTEgOC40NTAzNSAtMC4wNzg5MTMyIDcuOTM0ODkgMC4yMzUxOTYgNy42MjA3OVoiIGZpbGw9IiMwMDQ4RTgiLz4KPC9zdmc+Cgo=);
    background-position: 50%; background-size: cover; background-repeat: no-repeat;
}

.btn-bar{text-align:center; margin:30px auto;}
.btn-bar .btn{width:300px;}

/* Footer */
footer{background:#fff; height:190px; margin:0 -100px; padding:30px 50px; box-sizing:border-box;}
.yc-slogan img{display:block; height:60px;}
.school-list{margin:20px auto 10px;}
.center-aligned-list{display: flex; line-height: 2em;}
.center-aligned-list a{text-decoration:none; margin:0; position:relative; display:flex; align-items:center;}
.center-aligned-list a + a::before {content:''; width:4px; height:4px; background-color:var(--bs-color-ycred); border-radius: 50%; margin:0 10px;}
.footer-info{display:flex; justify-content:space-between; align-content:center; align-items:center; font-size: 12px;}

/* Message */
.no-side .page-wrap{padding-left:0;}
.no-side footer{margin:0;}
.no-side .main-wrap{padding:0; height:calc(100% - 190px); box-sizing: border-box; background-color:#002d98; background-position:right; background-repeat:no-repeat; background-image:url(../Images/OnlineEnquiry/online-enquiry_msg-bg.webp); background-size:auto 100%; position:relative;}
.msg-mask{position:absolute; top:0; right:0; bottom:0; left:0; box-sizing: border-box; background-position:right; background-repeat:no-repeat; background-image:url(../Images/OnlineEnquiry/online-enquiry_msg-mask.png); background-size:auto 100%;}
.message-wrap{height:100%; box-sizing:border-box; position:relative; z-index:2; color:#fff; display:flex; flex-direction:column; justify-content:center; padding-left:100px;}
.message-wrap h2{font-size:30px; width:40%; line-height:1.5; box-sizing:border-box; padding-left:20px; position:relative;}
.message-wrap h2::before{content:""; position:absolute; width:5px; top:5px; bottom:5px; left:0; background:#ff0044; border-radius:4px;}
.message-content{width:40%;}
.message-content p{font-weight:bold; line-height:1.5; margin:15px 0;}


/* Shade POP */
.shade{position: absolute; left:0; top:0; right:0; bottom:0; background: rgba(40,92,168,0.3); z-index: 10; display: none;}
.pop-wrap{width: 800px; height:300px; position: absolute; left:calc(50% - 400px); top:calc(50% - 150px); background: #fff; z-index: 11; box-sizing: border-box; padding:40px 60px; border:1px #7fa6ff solid; box-shadow: 0 0 30px rgba(0,0,0,0.3); display: none;}
.pop-wrap h2{font-size: 30px; color:#3a7bc3;}
.pop-content p{font-weight:bold; line-height: 2em; margin:15px 0;}
.pop-btn{text-align: right; margin-top: 30px;}
.pop-btn a.btn{background: #3cbbdb;}
.pop-btn a.btn:hover{background: #ce1141;}

@media (max-width: 1380px){
    header{height:80px; padding:0 40px;}
	.page-wrap{padding-left:300px; height:calc(100% - 80px);}
    .page-wrap{padding-left:300px;}
    .page-side, .page-side-mask{width:300px;}
    .page-side{padding-top:30px;}
    .page-side h2{font-size:20px;}
    .main-wrap{padding:30px 20px 0;}
    .form-wrap .splitLine{flex:0 0 calc(100% - 40px); margin-bottom:20px;}
    .form-item{padding-left:20px; padding-right:20px;}
    .add-text-box{padding:0 20px;}

    fieldset.form-wrap{width:calc(100% - 40px); padding:0; margin:20px auto;}
    fieldset.form-wrap .form-item{padding:10px; flex:0 0 calc(50% - 10px);}

    /* Footer */
    footer{height:140px; margin:0 -20px; padding:10px 30px;}
    .yc-slogan{margin-top:10px;}
    .yc-slogan img{display:block; height:50px;}
    .school-list{margin:10px auto 6px;}
    .center-aligned-list a + a::before {margin:0 5px;}

    .no-side .main-wrap{height:calc(100% - 140px);}
    .message-wrap h2{font-size:24px;}
    }
@media (max-width: 1280px){
    header{height:80px; padding:0 30px;}
	.page-wrap{padding-left:300px; height:calc(100% - 80px);}
    .page-side, .page-side-mask{width:300px;}
    .page-side{padding:30px 35px;}
    .page-side h2{font-size:20px; margin-bottom:20px;}
    .main-wrap{padding:30px 10px 0;}
    .form-wrap .splitLine{flex:0 0 calc(100% - 20px); margin-bottom:20px;}
    .form-item{padding-left:10px; padding-right:10px;}
    .add-text-box{padding:0 20px;}

    fieldset.form-wrap{width:calc(100% - 20px); padding:0; margin:20px auto;}
    fieldset.form-wrap .form-item{padding:10px; flex:0 0 50%;}

    /* Footer */
    footer{height:auto; margin:0 -10px; padding:10px 30px;}

    .no-side footer{height:140px;}
    .no-side .main-wrap{height:calc(100% - 140px);}
    .message-wrap{padding-left:60px;}
    .msg-mask{background-position:-160px;}

	}

@media (max-width:1024px){
    header{padding:0 30px;}
    .page-wrap{padding-left:260px;}
    .page-side, .page-side-mask{width:260px;}
    .main-wrap{padding:0;}
    .form-wrap{display:block; padding:10px 30px;}
    .form-item{padding-left:0; padding-right:0;}
    .sub_form-wrap.row-100{display:block;}
    .add-text-box{padding:0 30px; margin-top:20px; margin-bottom:0;}
    .add-text-box2{margin:0 auto 20px;}

    fieldset.form-wrap{width:calc(100% - 60px); padding:0; margin:20px auto;}
    fieldset.form-wrap .form-item{padding:10px;}

    /* Footer */
    footer{height:auto; margin:0; padding:10px 30px;}
    .yc-slogan{margin-top:10px;}
    .yc-slogan img{margin:0 auto;}
    .school-list{margin:10px auto;}
    .center-aligned-list{line-height: 2em; flex-wrap:wrap; justify-content:center;}
    .footer-info{display:block; text-align:center; font-size: 12px; margin:0 -20px;}

    .no-side footer{height:160px;}
    .no-side .main-wrap{height:calc(100% - 160px); background-position:0 60px; background-image:url(../Images/OnlineEnquiry/online-enquiry_msg-bg-sm.webp); background-size:100% auto; position:relative;}
    .msg-mask{background-position:0 -350px; background-image:url(../Images/OnlineEnquiry/online-enquiry_side-mask.png); background-size:100% auto;}
    .message-wrap{height:auto; padding:50px 150px 300px;}
    .message-wrap h2, .message-content{width:auto;}
}

@media (max-width: 820px){
	header{height:80px; padding:0 15px;}
    .page-wrap{padding:0; overflow:inherit;}
	.page-side{position:relative; width:100vw; height:calc(100vw / 3); background-image:url(../Images/OnlineEnquiry/online-enquiry_side-bg-sm.webp); background-position:right; background-size:auto 100%; padding:0 15px; display:flex; flex-direction:column; align-content:center; align-items:center; justify-content:center;}
    .page-side.fixed{position:fixed; top:0; z-index:2;}
    .page-side-mask{width:auto; left:0; top:0; right:0; bottom:0; background-image:url(../Images/OnlineEnquiry/online-enquiry_side-mask-sm.png); background-position:right; background-size:auto 100%;}
    .page-side h2{margin-bottom:0;}
    .menu{height:40px; width:100%; text-align:center;}
    .menu::before{width:auto; height:5px; top:unset; right:0; bottom:0;}
    .menu li{display:none;}
    .menu li::before{content:""; display:block; height:5px; position:absolute; left:0; right:0; top:unset; bottom:0; border-radius:5px!important;}
    .menu li a{padding-left:0; padding-right:0;}
    .menu li.m1::before{width:33.33333%;}
    .menu li.m2::before{width:66%;}
    .menu li.m3::before{width:100%;}
    .menu li.is-active{display:block;}    
    .main-wrap{padding:0; height:auto; overflow:inherit;}
    .form-wrap{display:block; padding:0 20px;}
    .form-wrap .splitLine{margin-bottom:30px;}
    .form-item{padding-left:0; padding-right:0;}
    .sub_form-wrap.row-100{display:block;}
    .btn-bar .btn{width:100%; padding-left:0; padding-right:0;}
    .add-text-box{padding:0 20px; margin-top:20px; margin-bottom:0;}
    .add-text-box2{margin:0 auto 20px;}

    fieldset.form-wrap{width:inherit; padding:6px; margin:20px 10px;}
    fieldset.form-wrap +  fieldset{margin-top:30px;}
    fieldset.form-wrap legend {margin:0 auto;}
    fieldset.form-wrap .form-item{padding:10px 5px;}

	/* Footer */
    footer{height:auto; margin:0; padding:10px 20px;}
    .yc-slogan{margin-top:10px;}
    .yc-slogan img{margin:0 auto; height:40px;}
    .school-list{margin:10px auto;}
    .center-aligned-list{line-height: 2em; flex-wrap:wrap; justify-content:center;}
    .footer-info{display:block; text-align:center; font-size: 12px; margin:0 -20px;}

    .no-side .main-wrap{height:auto; background-position:bottom; background-image:url(../Images/OnlineEnquiry/online-enquiry_msg-bg-sm.webp); background-size:100% auto; position:relative;}
    .msg-mask{background-position:bottom; background-image:url(../Images/OnlineEnquiry/online-enquiry_side-mask.png); background-size:100% auto;}
    .message-wrap{height:auto; padding:50px 20px 420px;}
    .message-wrap h2, .message-content{width:auto;}

	.pop-wrap{width:auto; height: auto; left:16px; top:100px; right:16px; bottom:100px; padding:40px 40px;}
	.pop-wrap h2, .message-wrap h2{font-size: 20px;}
}