/* [S] common */
.hidden,
.ir_text,
.sr_only{ width: 0; height: 0; overflow: hidden; color: transparent; position: absolute; left: -999999px}
.inner{ width: 1430px; max-width: 100%; height: auto; position: relative; margin: 0 auto; padding: 0 15px}
.m_show{ display: none !important;}
.m_show_flex{ display: none !important;}
.m_show800{ display: none !important;}
.m_hidden{ display: inline-block !important;}
.m_hidden_flex{ display: flex !important;}
.pointer,
button{ cursor: pointer}
.wrap{ width: 100%}
.small{ font-size: 0.875em}
.xsmall{ font-size: 0.750em}

.light{ font-weight: 300!important;}
.normal{ font-weight: 400!important;}
.md{ font-weight: 500!important;}
.bold{ font-weight: 600!important;}

.txt_xs{ font-size: 0.750rem !important;}
.txt_s{ font-size: 0.875rem !important;}
.txt_md{ font-size: 1rem !important;}
.txt_l{ font-size: 1.125rem !important;}
.txt_xl{ font-size: 1.250rem !important;}

.fz16{ font-size: 1rem}
.fz18{ font-size: 1.125rem}
.fz20{ font-size: 1.250rem}
.fz22{ font-size: 1.375rem}
.fz24{ font-size: 1.5rem}
.fz26{ font-size: 1.625rem}
.hid{position: absolute; margin: -1px; padding: 0; width: 1px; height: 1px; overflow: hidden;}

/*layout*/
.float_wrap:after{ content: ""; display: block; clear: both}
.fl{ float: left}
.fr{ float: right}
.block{ display: block}
.align_center{ text-align: center}
.align_left{ text-align: left}
.align_right{ text-align: right}
.middle{ width: 100%; height: auto; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%)}
.relative{ position: relative}
.flex{ display: flex}
.flex_wrap{ display: flex; flex-wrap: wrap}
.flex_now_wrap{ display: flex; flex-wrap: nowrap}
.flex_center{ display: flex; justify-content: center; align-content: center}
.flex_center_align{ display: flex; align-items: center; align-content: center}
.flex_center_justify{ display: flex; justify-content: center; justify-items: center}
.flex_je{ display: flex; justify-content: flex-end}
.flex_shrink{ flex-shrink: 0}
.space_between{ justify-content: space-between}

.position_center{ position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%}

/*ellipsis*/
.ellipsis{ text-overflow: ellipsis; overflow: hidden; -webkit-box-orient:vertical; display: -webkit-box; position: relative}
.ellipsis.txt_line1{ height: 1.3em; line-height: 1.3em; -webkit-line-clamp:1}
.ellipsis.txt_line2{ height: 2.6em; line-height: 1.3em; -webkit-line-clamp:2}
.ellipsis.txt_line3{ height: 3.9em; line-height: 1.3em; -webkit-line-clamp:3}
.ellipsis.txt_line4{ height: 5.2em; line-height: 1.3em; -webkit-line-clamp:4}

.mr0 { margin-right: 0!important;}
.mr5 { margin-right: 5px}
.mr10{ margin-right: 10px}
.mr15{ margin-right: 15px}
.mr20{ margin-right: 20px}
.mr25{ margin-right: 25px}
.mr30{ margin-right: 30px}
.mr40{ margin-right: 40px}
.mr50{ margin-right: 50px}
.ml0 { margin-left: 0!important;}
.ml5 { margin-left: 5px}
.ml10{ margin-left: 10px}
.ml15{ margin-left: 15px}
.ml20{ margin-left: 20px}
.ml25{ margin-left: 25px}
.ml30{ margin-left: 30px}
.ml40{ margin-left: 40px}
.ml50{ margin-left: 50px}
.mb0 { margin-bottom: 0!important;}
.mb5 { margin-bottom: 5px}
.mb10{ margin-bottom: 10px}
.mb15{ margin-bottom: 15px}
.mb20{ margin-bottom: 20px}
.mb25{ margin-bottom: 25px}
.mb30{ margin-bottom: 30px}
.mb40{ margin-bottom: 40px}
.mb50{ margin-bottom: 50px}
.mb60{ margin-bottom: 60px}
.mb70{ margin-bottom: 70px}
.mb80{ margin-bottom: 80px}
.mb90{ margin-bottom: 90px}
.mb100{ margin-bottom: 100px}
.mt0 { margin-top: 0!important;}
.mt5 { margin-top: 5px}
.mt10{ margin-top: 10px}
.mt15{ margin-top: 15px}
.mt15{ margin-top: 15px}
.mt20{ margin-top: 20px}
.mt25{ margin-top: 25px}
.mt30{ margin-top: 30px}
.mt40{ margin-top: 40px}
.mt50{ margin-top: 50px}
.mt60{ margin-top: 60px}
.mt70{ margin-top: 70px}
.mt80{ margin-top: 80px}
.mt90{ margin-top: 90px}
.mt100{ margin-top: 100px}

.p0 { padding: 0!important;}
.p5 { padding: 5px}
.p10{ padding: 10px}
.p15{ padding: 15px}
.p20{ padding: 20px}
.p25{ padding: 25px}
.p30{ padding: 30px}
.p40{ padding: 40px}
.p50{ padding: 50px}
.pr0 { padding-right: 0!important;}
.pr5 { padding-right: 5px}
.pr10{ padding-right: 10px}
.pr15{ padding-right: 15px}
.pr20{ padding-right: 20px}
.pr25{ padding-right: 25px}
.pr30{ padding-right: 30px}
.pr40{ padding-right: 40px}
.pr50{ padding-right: 50px}
.pl0 { padding-left: 0!important;}
.pl5 { padding-left: 5px}
.pl10{ padding-left: 10px}
.pl15{ padding-left: 15px}
.pl20{ padding-left: 20px}
.pl25{ padding-left: 25px}
.pl30{ padding-left: 30px}
.pl40{ padding-left: 40px}
.pl50{ padding-left: 50px}
.pb0 { padding-bottom: 0!important;}
.pb5 { padding-bottom: 5px}
.pb10{ padding-bottom: 10px}
.pb15{ padding-bottom: 15px}
.pb20{ padding-bottom: 20px}
.pb25{ padding-bottom: 25px}
.pb30{ padding-bottom: 30px}
.pb40{ padding-bottom: 40px}
.pb50{ padding-bottom: 50px}
.pb60{ padding-bottom: 60px}
.pb70{ padding-bottom: 70px}
.pb80{ padding-bottom: 80px}
.pb90{ padding-bottom: 90px}
.pb100{ padding-bottom: 100px}
.pt0 { padding-top: 0!important;}
.pt5 { padding-top: 5px}
.pt10{ padding-top: 10px}
.pt15{ padding-top: 15px}
.pt20{ padding-top: 20px}
.pt25{ padding-top: 25px}
.pt30{ padding-top: 30px}
.pt40{ padding-top: 40px}
.pt50{ padding-top: 50px}
.pt60{ padding-top: 60px}
.pt70{ padding-top: 70px}
.pt80{ padding-top: 80px}
.pt90{ padding-top: 90px}
.pt100{ padding-top: 100px}

.tac{ text-align: center}
.tal{ text-align: left}
.tar{ text-align: right}

/*border*/
.bdt_none{ border-top: none !important;}
.bdb_none{ border-bottom: none !important;}
.bdl_none{ border-left: none !important;}
.bdr_none{ border-right: none !important;}
.bd_none{ border: none !important;}
.bg_none{ background: transparent !important;}

.bd_t1{ border-top: solid 1px #131313}
.bd_t2{ border-top: solid 2px #131313}

.bdl{ border-left: solid 1px #EAEAEA !important;}

.bd_wrap{ border-top: solid 2px #0a134f; border-bottom: solid 1px #aeaeae}
.bd_wrap.p_type{ padding: 30px}
.bd_wrap .bd_wrap_tit{ font-size: 1.125rem; font-weight: bold; margin-bottom: 15px}

@media screen and (max-width: 1024px){
    .bd_wrap.p_type{ padding: 20px 15px}
}



/*input*/
select.small_box,
input.small_box{ width: 100px}
select,
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="text"]{ height: 50px; line-height: 50px; margin: 0; padding: 0 10px; font-size: 1rem; background-color: #F8F8F8;}
textarea{ width: 100%; height: 160px; overflow-y: auto; resize: none; padding: 15px 25px; display: block; background-color: #F8F8F8; text-align: left}
textarea[placeholder]{ font-size: 1rem; color: #888888}
select,
textarea,
input[type="number"],
input[type="password"],
input[type="tel"],
input[type="text"]{ border-radius: 0; border: none; max-width: 100%}
input.readonly{background: #eee; color: transparent; text-shadow: 1px 1px 1px #000; cursor: default}
input[type="checkbox"]{ width: 17px; height: 17px}
.ck_input_wrap{ display: inline-flex; align-items: center}

input[type="radio"] + label,
input[type="checkbox"] + label{ margin-left: 5px}
label + input[type="radio"],
label + input[type="checkbox"]{ margin-left: 15px}
select{
    min-width: 100px;
    background-image: url(/resource/templete/royal/img/common/icon_ac_drop.png);
    border: none;
    color: #888;
    padding-right: 30px;
    -webkit-appearance: none;
    position: relative;
    background-repeat: no-repeat;
    background-position: right 8px center;
}

.agree_box .agree_tit{ width: 100%; height: 80px; padding: 10px; display: flex; align-items: center; justify-content: space-between; font-size: 0.938rem; border-top: solid 1px #eaeaea}
.agree_box .agree_con{ padding-bottom: 40px}
.agree_box .agree_txt_box{ width: 100%; height: 160px; padding: 30px 20px; background: #F8F8F8; overflow-y: auto}

.required_txt{ font-size: 0.938rem; color: #444; font-weight: 400}

.bd_box{ padding: 30px; border: solid 1px #EAEAEA; border-top: solid 2px #131313;}
.bd_box.t_n{ border-top: solid 1px #EAEAEA;}

.bd_img_box{ padding: 60px 40px; border: solid 1px #DADADA; display: flex; align-items: center}
.bd_img_box .img_wrap{ width: 30%; margin-right: 40px; flex-shrink: 0; text-align: center}
.bd_img_box .txt_wrap{ line-height: +1.7 !important; font-size: 1rem !important;}
.bd_img_box .txt_wrap .img_wrap{ float: left; margin-bottom: 20px}

.dot{ width: 1.3em; height: 1em; display: inline-flex; align-items: center; transform: translateY(35%)}
.dot:before{ content: "·"; font-size: 2em; line-height: 0}

.no_data{ height: 300px; display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; border-bottom: solid 1px #AEAEAE}
.no_data .img_wrap{ margin-bottom: 35px}
.no_data .txt_wrap{ color: #888 !important; font-size: 1.125rem !important; font-weight: 500 !important;}

@media screen and (max-width: 1024px){
    .bd_box{ padding: 15px;}
    .bd_img_box{ padding: 30px 20px; display: block}
    .bd_img_box:after{ content: ""; width: 100%; display: block; clear: both}
    .bd_img_box .img_wrap,
    .bd_img_box .txt_wrap .img_wrap{ margin: 0 20px 20px 0; width: 50%; float: left}
}

/*btn*/
.btn{ border: none; cursor: pointer; display: inline-flex; align-items: center; text-align: center; justify-content: center}
.btn + .btn{ margin-left: 15px}

.btn_more{ width: 45px; height: 45px; border-radius: 50%; background: #000 url("/resource/templete/royal/img/common/ic_arr_w.png") no-repeat center}

.arr_btn_w{ height: 50px;  padding: 0 20px; justify-content: space-between; border: solid 1px #fff; color: #fff !important; font-weight: 500}
.arr_btn_b{ height: 50px;  padding: 0 20px; justify-content: space-between; border: solid 1px #000; color: #000 !important; font-weight: 500}
.arr_btn_b img,
.arr_btn_w img{ width: 13px; margin-left: 20px}

.link_btn_w{ height: 50px;  padding: 0 20px; justify-content: space-between; border: solid 1px #fff; color: #fff !important; font-weight: 500}
.link_btn_b{ height: 50px;  padding: 0 20px; justify-content: space-between; border: solid 1px #000; color: #000 !important; font-weight: 500}
.link_btn_b img,
.link_btn_w img{ width: 13px; margin-right: 10px}

.link_txt{ color: #0A3E88 !important; padding-bottom: 1px; border-bottom: solid 1px #0A3E88}
.link_txt_r{ color: #BD2828 !important; padding-bottom: 1px; border-bottom: solid 1px #BD2828}

.down_btn{ font-size: 0.813rem; padding: 5px 10px}
.down_btn img{ margin-left: 10px}

.link_btn{ font-size: 0.813rem; padding: 5px 10px}
.link_btn img{ margin-right: 10px}

.course_btn{ height: 50px;  padding: 0 20px; justify-content: space-between; border: solid 1px #000; color: #000 !important; font-weight: 500; background: #fff}
.course_btn img{ margin-right: 10px}

.btn_xs{ font-size: 0.750rem; padding: 5px 13px}
.btn_xs2{ width: 90px; height: 35px; font-size: 0.813rem}
.btn_s{ width: 120px; height: 35px; font-size: 0.875rem}
.btn_r{ width: 130px; height: 50px; font-size: 1.125rem}
.btn_r2{ min-width: 180px; height: 50px; font-size: 1.125rem; padding: 0 20px}
.btn_md{ width: 160px; height: 45px; font-size: 1rem; border-radius: 5px}
.btn_lg{ width: 180px; height: 75px; font-size: 1.250rem; font-weight: 600; border-radius: 5px}

/*ctg*/
.ctg_s{ width: 70px; height: 25px; border-radius: 13px; display: flex; align-items: center; justify-content: center; font-size: 0.750rem;}

/*grid*/
.grid_half{ width: 100%; display: grid; grid-template-columns: repeat(2,1fr); gap: 30px}

@media screen and (max-width: 1024px){
    .m_show{ display: block !important;}
    .m_show_flex{ display: flex !important;}
    .m_hidden,
    .m_hidden_flex{ display: none !important;}

    .btn + .btn{ margin-left: 5px}

    .btn_r2,
    .arr_btn_w,
    .arr_btn_b,
    .link_btn_w,
    .link_btn_b{ padding: 0 10px}

    .grid_half{ grid-template-columns: repeat(1,1fr);}
}

@media screen and (max-width: 800px){
	.m_show800{ display: block !important;}

    .btn_wrap.has_border{ padding-top: 40px}
    .mo_btn .btn + .btn{ margin-left: 0; margin-top: 10px}
}


.ti20 > .ti_item{ padding-left: 15px; text-indent: -20px}
.ti24 > .ti_item{ padding-left: 35px; text-indent: -24px}
.ti25 > .ti_item{ padding-left: 35px; text-indent: -25px}

/*color*/
.c_black{ color: #131313 !important}
.bg_black{ background: #131313!important; color: #fff !important;}
.bd_black{ border: solid 1px #131313 !important; color: #131313 !important;}
.c_gray888{ color: #888 !important;}
.bg_gray888{ background: #888888 !important; color: #fff !important;}
.bd_gray888{ border: solid 1px #888888 !important; color: #888 !important;}
.c_gray70{ color: #707070 !important;}
.bg_gray70{ background: #707070 !important; color: #fff !important;}
.bd_gray70{ border: solid 1px #707070 !important; color: #707070 !important;}
.c_gray333{ color: #333 !important;}
.bg_gray333{ background: #333 !important; color: #fff !important;}
.bd_gray333{ border: solid 1px #333 !important; color: #333 !important;}
.c_blue{ color: #045BA6 !important}
.bg_blue{ background: #045BA6 !important; color: #fff !important;}
.bd_blue{ border: solid 1px #045BA6 !important; color: #045BA6 !important;}
.c_blue2{ color: #17106E !important}
.bg_blue2{ background: #17106E !important; color: #fff !important;}
.bd_blue2{ border: solid 1px #17106E !important; color: #17106E !important;}
.c_red{ color: #A50404 !important}
.bg_red{ background: #A50404 !important; color: #fff !important;}
.bd_red{ border: solid 1px #A50404 !important; color: #A50404 !important;}
.c_red2{ color: #B40A0A !important}
.bg_red2{ background: #B40A0A !important; color: #fff !important;}
.bd_red2{ border: solid 1px #B40A0A !important; color: #B40A0A !important;}

.time_red{ background: #F7E6E6; border-radius: 13px; padding: 3px 8px; font-size: 0.875rem; color: #B40A0A; margin: 3px; display: inline-flex}
.time_blue{ background: #F2F1FC; border-radius: 13px; padding: 3px 8px; font-size: 0.875rem; color: #17106E; margin: 3px; display: inline-flex}
.time_gray{ background: #F8F8F8; border-radius: 13px; padding: 3px 8px; font-size: 0.875rem; color: #131313; margin: 3px; display: inline-flex}

.time_red.big,
.time_blue.big,
.time_gray.big{ width: 200px; max-width: 100%; text-align: center; justify-content: center}

.gray333{ color: #333 !important}
.gray666{ color: #666 !important}
.white{ color: #fff !important}
.red{ color: #B40A0A !important}
.blue{ color: #17106E !important}
.blue2{ color: #053863 !important}
.yellow{ color: #FFCC00 !important}
.c_type01 .bg{ background: #454485 !important; color: #fff !important;}
.c_type01 .bd{ border: solid 1px #454485 !important;}
.c_type01 .color{ color: #454485 !important;}
.c_type02 .bg{ background: #0BA0A9 !important; color: #fff !important;}
.c_type02 .bd{ border: solid 1px #0BA0A9 !important;}
.c_type02 .color{ color: #0BA0A9 !important;}
.c_type03 .bg{ background: #264A50 !important; color: #fff !important;}
.c_type03 .bd{ border: solid 1px #264A50 !important;}
.c_type03 .color{ color: #264A50 !important;}
.c_type04 .bg{ background: #B63F3F !important; color: #fff !important;}
.c_type04 .bd{ border: solid 1px #B63F3F !important;}
.c_type04 .color{ color: #B63F3F !important;}
.c_type05 .bg{ background: #6E606D !important; color: #fff !important;}
.c_type05 .bd{ border: solid 1px #6E606D !important;}
.c_type05 .color{ color: #6E606D !important;}
.c_type06 .bg{ background: #1D1E23 !important; color: #fff !important;}
.c_type06 .bd{ border: solid 1px #1D1E23 !important;}
.c_type06 .color{ color: #1D1E23 !important;}
.c_type07 .bg{ background: #FBDF3D !important; color: #131313 !important;}
.c_type07 .bd{ border: solid 1px #FBDF3D !important;}
.c_type07 .color{ color: #FBDF3D !important;}
.c_type08 .bg{ background: #17106E !important; color: #fff !important;}
.c_type08 .bd{ border: solid 1px #17106E !important;}
.c_type08 .color{ color: #17106E !important;}
.c_type09 .bg{ background: #066051 !important; color: #fff !important;}
.c_type09 .bd{ border: solid 1px #066051 !important;}
.c_type09 .color{ color: #066051 !important;}

/*궁능유적본부*/
.cha .bg{ background: #131313 !important; color: #fff !important;}
.cha .bd{ border: solid 1px #131313 !important;}
.cha .color{ color: #131313 !important;}
.cha .color.bg{ color: #fff !important;}

/*경복궁*/
.gbg .bg{ background: #604206 !important; color: #fff !important;}
.gbg .bd{ border: solid 1px #604206 !important;}
.gbg .color{ color: #604206 !important;}
.gbg .color.bg{ color: #fff !important;}

/*창덕궁*/
.cdg .bg{ background: #A2383D !important; color: #fff !important;}
.cdg .bd{ border: solid 1px #A2383D !important;}
.cdg .color{ color: #A2383D !important;}
.cdg .color.bg{ color: #fff !important;}

/*창경궁*/
.cgg .bg{ background: #14489C !important; color: #fff !important;}
.cgg .bd{ border: solid 1px #14489C !important;}
.cgg .color{ color: #14489C !important;}
.cgg .color.bg{ color: #fff !important;}

/*덕수궁*/
.dsg .bg{ background: #286D79 !important; color: #fff !important;}
.dsg .bd{ border: solid 1px #286D79 !important;}
.dsg .color{ color: #286D79 !important;}
.dsg .color.bg{ color: #fff !important;}

/*종묘*/
.jms .bg{ background: #C14B35 !important; color: #fff !important;}
.jms .bd{ border: solid 1px #C14B35 !important;}
.jms .color{ color: #C14B35 !important;}
.jms .color.bg{ color: #fff !important;}

/*조선왕릉*/
.rtm .bg{ background: #47325D !important; color: #fff !important;}
.rtm .bd{ border: solid 1px #47325D !important;}
.rtm .color{ color: #47325D !important;}
.rtm .color.bg{ color: #47325D !important;}

/*칠궁*/
.svg .bg{ background: #604206 !important; color: #fff !important;}
.svg .bd{ border: solid 1px #604206 !important;}
.svg .color{ color: #604206 !important;}
.svg .color.bg{ color: #604206 !important;}

/*숭례문*/
.sym .bg{ background: #47325D !important; color: #fff !important;}
.sym .bd{ border: solid 1px #47325D !important;}
.sym .color{ color: #47325D !important;}
.sym .color.bg{ color: #47325D !important;}

/*네이버*/
.link_NAV{ border: solid 1px #45B85B !important; color: #45B85B !important;}

/*11번가*/
.link_ONE{ border: solid 1px #D6001F !important; color: #D6001F !important;}

/*티켓링크*/
.link_TKL{ border: solid 1px #DD0000 !important; color: #DD0000 !important;}

/*인터파크*/
.link_IPK{ border: solid 1px #1769FF !important; color: #1769FF !important;}

/*유포러스*/
.link_UFR{ border: solid 1px #755F90 !important; color: #755F90 !important;}

/*구글폼*/
.link_GOO{ border: solid 1px #7147BC !important; color: #7147BC !important;}


/*txt type*/
.txt{ font-size: 1rem; color: #333; line-height: +1.3}
.lh5{  line-height: +1.5}
.lh6{  line-height: +1.6}
.lh7{  line-height: +1.7}


/*z-index*/
.z0{ position: relative; z-index: 0}
.z1{ position: relative; z-index: 1}
.z2{ position: relative; z-index: 2}
.z3{ position: relative; z-index: 3}
.z4{ position: relative; z-index: 4}
.z5{ position: relative; z-index: 5}
.z6{ position: relative; z-index: 6}
.z7{ position: relative; z-index: 7}
.z8{ position: relative; z-index: 8}
.z9{ position: relative; z-index: 9}
.z10{ position: relative; z-index: 10}


/*layer popup*/
.dim{
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 9998;
    background: rgba(0,0,0,0.8);
    display: none;
}
.layer_popup,
.layer_popup *{ box-sizing: border-box;}
.layer_popup{
    width: 1000px;
    max-width: calc(100% - 30px);
    height: auto;
    max-height: calc(100% - 30px);
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 9999;
    background: #fff;
    display: none;
}
.layer_popup.md{ width: 1000px}
.layer_popup.s{ width: 800px}
.layer_popup.xs{ width: 500px}
.popup_header{ font-size: 1.5rem; color: #fff; padding: 0 75px 0 50px; background: #131313; height: 80px; line-height: 80px}
.popup_body{ padding: 50px; position: relative; max-height: calc(100vh - 200px); overflow-y: auto; font-size: 0.938rem;}
.layer_popup .btn_wrap{ padding-bottom: 90px; margin-top: 40px !important}
.layer_popup .ic_close{ width: 80px; height: 80px; position: absolute; right: 0; top: 0; background: url("/resource/templete/royal/img/common/icon_close_w.png") no-repeat center;}
.layer_popup .table_item .con{ color: #131313 !important; justify-content: center}

.layer_popup.layer_message{ width: 600px; max-width: calc(100% - 30px); text-align: center}
.layer_popup.layer_message .popup_header{ width: 100%; height: auto; margin: 60px 0 0; font-size: 2rem; font-weight: bold; background: none; color: #131313; padding: 0; text-align: center; line-height: +1.2}
.layer_popup.layer_message .popup_body{ width: 100%; height: auto; padding: 30px 30px 70px}
.layer_popup.layer_message .message_img{ margin-bottom: 30px}
.layer_popup.layer_message .message_img .big{ font-weight: bold; font-size: 5.625rem; line-height: +1}
.layer_popup.layer_message .message_txt{ font-size: 1.250rem}
.layer_popup.layer_message .pop_btn_wrap{ width: 100%; height: 70px; display: flex}
.layer_popup.layer_message .pop_btn_wrap .btn{ flex: 1; font-size: 1.250rem; font-weight: 500}
.layer_popup.layer_message .pop_btn_wrap .btn + .btn{ margin-left: 0}
.layer_popup.layer_message .ic_close{ filter: brightness(0)}

.layer_popup.pop_type02{ border-radius: 40px}
.layer_popup.pop_type02 .ic_close{ width: 50px; height: 50px; border-radius: 50%; background-color: #131313; background-size: 35%; right: 50px; top: 50px}

.layer_popup.pop_course{ width: 1200px; overflow: hidden}
.pop_course .popup_body{ padding: 50px 0 0}
.pop_course .course_pop_con{ justify-content: center; width: 100%}
.pop_course .popup_body .top{ width: 100%; padding: 30px 50px; display: flex}
.pop_course .popup_body .top{ width: 100%; padding: 30px 50px}
.pop_course .popup_body .btm{ width: 100%; padding: 50px; background: #F8F8F8}

.pop_inn_half{ display: flex;}
.pop_inn_half .half{ width: 50%}

.layer_popup.pop_media{ width: 900px; max-width: calc(100% - 50px); padding: 0}
.layer_popup.pop_media .popup_body{ width: 100%; position: relative; padding: 0}
.layer_popup.pop_media .popup_body .iframe_wrap{ width: 100%; position: relative}
.layer_popup.pop_media .popup_body .iframe_wrap:after{ content: ""; padding-top: 56.1%; display: block}
.layer_popup.pop_media .popup_body .iframe_wrap iframe{ width: 100%; height: 100%; position: absolute; left: 0; top: 0}
.layer_popup.pop_media .popup_body img{ width: 100%}
.layer_popup.pop_media .ic_close{ width: 50px; height: 50px; border-radius: 50%; background: #fff url("/resource/templete/royal/img/common/icon_close_b.png") no-repeat center / 35% auto; transform: translate(100%, -100%)}

.layer_popup.pop_media.full{ width: 100%; max-width: calc(100% - 50px); padding: 0}
.layer_popup.pop_media.full .popup_body{ padding: 30px 20px}
.layer_popup.pop_media.full .ic_close{ transform: translate(0, -100%); margin-top: -10px}

@media screen and (max-width: 1100px){
    .layer_popup.pop_media .ic_close{ transform: translate(0, -100%); margin-top: -10px}
}
@media screen and (max-width: 1024px){
    .pop_inn_half{ display: block; margin-bottom: 50px}
    .pop_inn_half .half{ width: 100%}

}
@media screen and (max-width: 800px){
    .layer_popup{ padding: 0 0 50px 0}
    .popup_header{ padding: 0 50px 0 20px}
    .layer_popup .ic_close{ right: 0; top: 0}
    .popup_body{ padding: 20px; max-height: calc(100vh - 150px);}
    .layer_popup .btn_wrap{ margin-top: 20px !important}

    .layer_popup.layer_message{ padding: 0}
    .layer_popup.layer_message .popup_body{ max-height: calc(100vh - 150px);}

    .layer_popup.pop_type02 .ic_close{ right: 15px; top: 20px}

    .pop_course .popup_body .top{ padding: 20px; display: block}
    .pop_course .popup_body .top .half{ width: 100%}
    .pop_course .course_pop_con{ padding: 0 20px}
    .course_pop_con .list .item a{ padding: 0 15px}
    .pop_course .popup_body .btm{ padding: 20px}
}

/* pop table*/
.popup_body .table_wrap{ max-height: 450px; overflow-y: auto}
.pop_table{ width: 100%}
.pop_table thead tr{ border-bottom: solid 1px rgba(174, 174, 174, 0.28)}
.pop_table tbody tr{ border-bottom: solid 1px rgba(174, 174, 174, 0.46)}
.pop_table th{ background: rgba(255,255,255,0.05)}
.pop_table th,
.pop_table td{ height: 60px; color: #eee; font-size: 1.125rem; text-align: center; vertical-align: middle; padding: 5px; font-weight: 400}
.pop_table td .img_wrap{ width: 100px; height: 100px; border: solid 1px #aeaeae; display: inline-flex; align-items: center; justify-content: center; background: url("/resource/templete/royal/img/common/no_img.png") no-repeat center / cover; margin: auto}
.pop_table td .img_wrap img{ max-width: 100%; max-height: 100%}
.pop_table .m_num{ display: none}

@media screen and (max-width: 800px){
    .popup_body .table_wrap{ max-height: 180px}
    .pop_table colgroup,
    .pop_table .thumb,
    .pop_table thead,
    .pop_table .pc_num{ display: none}
    .pop_table,
    .pop_table tbody,
    .pop_table tr,
    .pop_table td{ display: block; width: 100%; height: auto; text-align: left}
    .pop_table td{ padding: 5px 0}
    .pop_table tr{ padding: 15px}
    .pop_table td.info{ display: inline-block; width: auto; font-size: 0.875rem; opacity: 0.9; padding-left: 0; padding-right: 0}
    .pop_table td.info:after{ content: "|"; font-size: 0.750em; margin: 0 0.625rem; position: relative; top: -0.1em}
    .pop_table td.info:last-child:after{ display: none}
    .pop_table td .m_num{ display: inline-block; margin-right: 10px}
    .pop_table td .m_num:after{ content: "."}
}

/*select*/
.select{ width: auto; min-width: 170px; height: 50px; border-radius: 10px}
.select + *{ margin-left: 10px}

/*table common*/
.table{ table-layout: fixed; width: 100%}
.table caption{ width: 0; height: 0; position: absolute; overflow: hidden; color: transparent}
.table tr{ border-bottom: solid 1px rgba(174, 174, 174, 0.28);}
.table thead tr:last-child,
.table tbody tr:last-child{ border-bottom: solid 1px rgba(174, 174, 174, 0.46);}
.table th,
.table td{ vertical-align: middle; text-align: center; height: 80px; font-size: 0.938rem;}
.table th{ background: #F8F8F8; padding: 15px 10px; color: #131313; font-weight: normal}
.table td{ padding: 15px 10px; color: #333}

.table tr td.tit{ text-align: left}
.table tr td.tit a:focus,
.table tr td.tit a:hover{ text-decoration: underline; text-underline-position: under}

.table tr.notice_tr{ background: #FFFFF1}
.table tr.notice_tr .notice{ background: #131313; font-size: 0.875rem; color: #fff; display: inline-flex; align-items: center; justify-content: center; width: 70px; max-width: 100%; height: 25px; border-radius: 13px}

.table tr.notice_tr td{ font-weight: bold}

.table_wrap{ width: 100%; overflow-x: auto; padding-bottom: 10px}
.table_wrap .table{ min-width: 800px}
/*.table a{ height: auto}*/

.table.bd_table{ border-top: 2px solid #000; border-bottom: solid 1px #AEAEAE}
.table.bd_table tr{ border-bottom: solid 1px #dfdfdf}
/*.table.bd_table tr th,*/
/*.table.bd_table tr td{ border-right: solid 1px #dfdfdf}*/
.table.bd_table tbody tr:last-child{ border-bottom: none}
.table.bd_table tr th:last-child,
.table.bd_table tr td:last-child{ border-right: none}

.table .t_inn_wrap{ line-height: +1.5; padding: 10px}

.table.th_c th{ background: #F8F8F8; font-weight: 500; color: #131313; height: 55px}

.table.bd tr{ border-bottom: solid 1px #EAEAEA}
.table.bd tbody tr:last-child{ border-bottom: none}
.table.bd th,
.table.bd td{ border-left: solid 1px #EAEAEA}
.table.bd tr th:first-child,
.table.bd tr td:first-child{ border-left: none}

/*table - m_layout*/
@media screen and (max-width: 800px){
    .table_wrap{ cursor: move}

    .table.m_layout{ border-top: 1px solid rgba(174, 174, 174, 0.46);}
    .table.m_layout colgroup,
    .table.m_layout .thumb,
    .table.m_layout thead,
    .table.m_layout .pc_num{ display: none}
    .table.m_layout,
    .table.m_layout tbody,
    .table.m_layout tr,
    .table.m_layout td{ display: block; width: 100%; height: auto !important; text-align: left}
    .table.m_layout td{ padding: 5px 0 !important;}
    .table.m_layout tr{ padding: 15px !important;}
    .table.m_layout tr td.info{ display: inline-flex; align-items: center; width: auto; font-size: 0.875rem; opacity: 0.9}
    .table.m_layout tr td.info:before{ content: "|"; font-size: 0.750em; margin: 0 0.65rem 0 0.45rem}
    .table.m_layout tr td.info.first:before,
    .table.m_layout tr td.info:first-child:before{ display: none}
    .table.m_layout td .m_num{ display: inline-block; margin-right: 10px}
    .table.m_layout td .m_num:after{ content: "."}
    .table.m_layout td.tit{ font-size: 1.125rem}

    .table.m_layout .m_none{ display: none}
    .table.m_layout .r_type{ display: none}
}

.required:after{ content: "*"; color: #B82323; margin-left: 5px}

/*ul table layout*/
.table_info{ font-size: 0.875rem; color: #444; margin-bottom: 3px;}
.table_list{ width: 100%; color: #131313; box-shadow: 0px 2px 10px rgba(0,0,0,0.1); display: flex; flex-wrap: wrap}
.table_item{ width: 100%; display: flex; border-top: 1px solid #dfdfdf; font-size: 1.375rem}
.table_item.half{ width: 50%}
.table_item .tit{ max-width: 250px; min-width: 120px; width: 33%; flex-shrink: 0; padding: 10px 40px; background: #4E537B; color: #eee; display: flex; align-items: center; align-content: center; word-break: keep-all; text-align: center; justify-content: center}
.table_item .con{ width: 100%; padding: 10px 20px; min-height: 100px; display: flex; flex-wrap: wrap; align-items: center; align-content: center; background: rgba(255,255,255,0.3); color: var(--color-tit); position: relative;}
.table_item .con .numSignWrap{ width: 100%; position: relative;}
.table_item .con .numSign{ width: 100%}
.table_item .con .numSignBtn{ width: 25px; height: 25px; position: absolute; right: 0; top: 0; background: url("/resource/templete/manpa/img/common/icon_arr_r.png") no-repeat center; transform: rotate(90deg); transition: rotate 0.5s; display: none;}
.table_item .con .numSign + .numSignBtn{ display: block;}
.table_item .con .numSign:not(#numSign0){ display: none;}
.table_item .con.open .numSign:not(#numSign0){ display: block;}
.table_item .con.open .numSignBtn{ transform: rotate(-90deg)}
.darkmode .table_item .con .numSignBtn{ filter: brightness(10);}
.table_item .con .wrap + .wrap{ margin-top: 10px}
.table_item .con .info_wrap .info{ color: #131313; font-size: 1.375rem;}
.table_item .con input[type="password"],
.table_item .con input[type="text"],
.table_item .con input[type="file"],
.table_item .con select{ width: 100%; max-width: 150px}
.table_item .con select + select{ margin-left: 5px;}
.table_item .con .table_info{ margin: 0 0 0 5px;}
.table_item .con .status{ font-weight: bold}
@media screen and (max-width: 600px){
    .table_item{ flex-wrap: wrap}
    .table_item .tit{ max-width: 100%; width: 100%; padding: 10px; font-size: 1.125rem}
    .table_item .con{ padding: 10px; flex-wrap: wrap; min-height: 50px; opacity: 0.8; font-size: 1rem}
    .table_item .con input[type="password"],
    .table_item .con input[type="text"],
    .table_item .con select{ width: 100%; max-width: 100%}
    .table_item .con select + select{ margin-left: 0; margin-top: 5px;}
    .table_item .con .table_info{ margin: 5px 0 0 0; }
}

/*ul table layout - type_02*/
.type_02.table_list{ display: grid; grid-template-columns: repeat(2, 1fr);}
.type_02.table_list .row2{ grid-column: 2/3; grid-row: 1/3}
.type_02.table_list .row2 .con_wrap{ width: 100%}
.type_02.table_list .row2 .con_wrap .con{ height: 50%}
.type_02.table_list .con_wrap .con + .con{ border-top: solid 1px #dfdfdf}
.type_02.table_list .con_tit{ flex-shrink: 0; width: 150px}
.type_02.table_list .table_item.full{ grid-column: 1 / 3;}
.type_02.table_list .table_item.full .tit{ width: 25%}
.type_02.table_list .table_item .tit{ width: 50%}

@media screen and (max-width: 1024px){
    .type_02.table_list{ display: block;}
    .type_02.table_list .row2{ border-top: solid 1px #dfdfdf !important;}
    .type_02.table_list .row2 .con_wrap .con{ height: auto}
    .type_02.table_list .table_item .tit{ width: 250px !important;}
    .type_02.table_list .con_tit{ margin-bottom: 10px; font-weight: bold}
}
@media screen and (max-width: 600px){
    .type_02.table_list .table_item .tit{ width: 100% !important;}
}

/*ul table layout - type_03*/
.type_03.table_list{ display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #dfdfdf; border-bottom: 1px solid #dfdfdf;}
.type_03.table_list .con_tit{ flex-shrink: 0; width: 150px}

@media screen and (min-width: 1024px){
    .type_03.table_list .table_item:nth-child(-n+3) { border-top: none}
}
@media screen and (max-width: 1024px){
    .type_03.table_list{ display: block;}
    .type_03.table_list .table_item:nth-child(1) { border-top: none}
}

/* [S] email_wrap */
.email_wrap{ width: 100%; display: flex; align-items: center;}
.email_wrap input[type="text"],
.email_wrap select{ max-width: calc((100% - 35px)/3); width: 100%;}
.email_wrap .at{ width: 25px; display: block; text-align: center; flex-shrink: 0}
.email_wrap input[type="text"] + select{ margin-left: 10px;}
@media screen and (max-width: 400px){
    .email_wrap input[type="text"],
    .email_wrap select{ max-width: 100%!important; width: calc((100% - 30px)/3) !important;}
    /*type_02*/
    .type_02.email_wrap{ flex-wrap: wrap}
    .type_02.email_wrap input[type="text"],
    .type_02.email_wrap select{ max-width: 100%!important; margin: 3px 0}
    .type_02.email_wrap input[type="text"]:first-child{ width: calc(100% - 15px)}
    .type_02.email_wrap .at{ margin: 0; width: 15px; text-align: center;}
    .type_02.email_wrap input[type="text"] + select{ margin-left: 0}
}
/* [E] email_wrap */

/* [S] tel_wrap */
.tel_wrap{ width: 100%; display: flex; align-items: center;}
.tel_wrap input[type="text"],
.tel_wrap select{ max-width: calc((100% - 30px)/3); font-size: 0.938rem; width: 100%;}
.tel_wrap .dash{ width: 15px; text-align: center; display: block; flex-shrink: 0;}
@media screen and (max-width: 400px){
    .tel_wrap input[type="text"],
    .tel_wrap select{ max-width: 100%!important; width: calc((100% - 30px)/3) !important;}
    /*type_02*/
    .type_02.tel_wrap{ flex-wrap: wrap}
    .type_02.tel_wrap input[type="text"],
    .type_02.tel_wrap select{ max-width: 100%!important; margin: 3px 0}
    .type_02.tel_wrap select,
    .type_02.tel_wrap input[type="text"].tel_first{ width: calc(100% - 15px) !important;}
    .type_02.tel_wrap .dash{ margin: 0; width: 15px; text-align: center;}
}
/* [E] tel_wrap */

/*width*/
.w_auto{ width: auto}
.full{ width: 100%}
.half{ width: 50%}

.half_wrap{ display: flex}

/*tab*/
.tab_menu{ display: flex}
.tab_link{ flex: 1}
.tab_link a{ width: 100%; height: 100%; display: flex; align-items: center; justify-content: center}
.tab_con{ display: none}
.tab_con.current{ display: block}

/*dash item*/
.dash_item{ margin: 25px 0; position: relative; display: flex; align-items: flex-start; padding-left: 1.375rem;}
.dash_item:before{ content: ""; width: 6px;height: 4px; background: var(--color-tit); position: absolute;left: 0;top: 0.5em}

/*dot item*/
.dot_item{ padding-left: 1.3em; position: relative}
.dot_item .dot{ position: absolute; left: 0; top: -0.25em}

/* [E] common */

/* [S] skip */
/* .skip_menu a{
    overflow: hidden;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 1px;
    background: #000;
    color: #fff;
    text-align: center;
    z-index: 999999;
}
.skip_menu a:focus,
.skip_menu a:active {
    position: relative;
    width: 100%;
    height: auto;
    padding: 10px;
} */
/* [E] skip */

/* [S] skip */
.skipmenu {position:relative;overflow:hidden;z-index:3000;width:100%;}
.skipmenu a{display:block !important;overflow:hidden;z-index:3000;height:1px;width:1px;margin:0 -1px -1px 0;font-size:0;line-height:0;text-align:center}
.skipmenu a:focus, .skipmenu a:hover, .skipmenu a:active {border: 2px solid red; width:auto;height:30px;margin:0;padding:8px 0;background:#20262c;font-size:14px;font-weight:700;line-height:1;color:#fff;}

/*media common*/
@media (max-width: 1024px){
    .m_show{ display: inline-block}
    .m_hidden{ display: none}
}
@media (max-width: 800px){
    select,
    input[type="password"],
    input[type="number"],
    input[type="tel"],
    input[type="text"],
    textarea[placeholder]{ font-size: 0.944rem}
    textarea[placeholder]{ line-height: +1.3}

    .mw20{ width: 20px !important;}
    .mw30{ width: 30px !important;}
    .mw40{ width: 40px !important;}
    .mw50{ width: 50px !important;}
    .mw60{ width: 60px !important;}
    .mw70{ width: 70px !important;}
    .mw80{ width: 80px !important;}
    .mw90{ width: 90px !important;}
    .mw100{ width: 100px !important;}
}
@media (max-width: 500px){
    body, html{ font-size: 17px}
}

/*paging*/
.paging_wrap{ display: flex; justify-content: center}
.paging{display: flex;min-height: 36px;white-space: nowrap;text-align: center;justify-content: center;padding-top:10px; padding-bottom: 10px;}
.paging:after{display: block;content: "";clear: both;}
.paging a{display: block;vertical-align: top;margin-right: 5px;}
.paging .btn_first, .paging .btn_prev, .paging .btn_next, .paging .btn_last{position: relative;width: 36px;height: 36px;border: 1px solid #a6a6a6; background: #fff}
.paging .btn_first:after, .paging .btn_prev:after, .paging .btn_next:after, .paging .btn_last:after{display: block;content: "";position: absolute;left: 0;top: 0;width: 36px;height: 36px;background: url(/resource/templete/royal/img/common/arr_paging.png) no-repeat;}
.paging .btn_last{margin-right: 0;}
.paging .btn_first:after{background-position: 0 0;}
.paging .btn_prev:after{background-position: -36px 0;}
.paging .btn_next:after{background-position: -72px 0;}
.paging .btn_last:after{background-position: -108px 0;}
.paging .paginate_input_wrap{ display: flex;margin: 0;font-size: 18px;font-weight: 700;color: #575757;}
.paging .paginate_input_wrap > *{height: 35px;line-height: 35px;float: left;}
.paging .paginate_input{ display: inline-block;width: 30px;height: 34px;line-height: 33px; max-height: 36px; margin-right: 5px;border: 1px solid #fff;font-size: 1.125rem;font-weight: 700;color: #575757;text-align: center;vertical-align: top;padding: 0;position: relative;border-bottom: 2px solid #575757;background: none}
.paging .paginate_input2{ width: 45px;}
.paging .total_num{margin-right: 10px;height: 34px;line-height: 34px;margin-left: 5px;font-size: 1rem}
.paging .btn_page_go{ width: 45px;height: 36px;background: #626262;font-weight: 500;color: #fff;line-height: 36px; margin-right: 5px}

@media (max-width: 800px){
    .paging .btn_first, .paging .btn_prev,
    .paging .btn_next, .paging .btn_last{ width: 30px; height: 30px; position: relative}
    .paging .btn_first:after, .paging .btn_prev:after,
    .paging .btn_next:after, .paging .btn_last:after{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%)}
    .paging .btn_page_go,
    .paging .paginate_input,
    .paging .paginate_input_wrap > *{ height: 30px; line-height: 30px}
    .paging a,
    .paging .btn_page_go{ margin-right: 2px}
    .paging .total_num{ margin-right: 5px}
}

/*trigger*/
.trigger_wrap{ position: relative}
.trigger_wrap .trigger_toggle{ display: none}
.trigger_wrap.open .trigger_toggle{ display: block}
/*.trigger_close{ position: absolute; right: 15px; top: 15px; width: 30px; height: 30px; background: #282629 url("/resource/templete/royal/img/common/icon_close_w.png") no-repeat center / 60% auto; z-index: 101; border-radius: 5px; opacity: 0.5}*/
.trigger_close {
	position: absolute;
	right: -400px;
	top: 105px;
	width: 30px;
	height: 30px;
	background: #282629 url("/resource/templete/royal/img/common/icon_close_w.png") no-repeat center / 60% auto;
	z-index: 101;
	border-radius: 5px;
	opacity: 0.5
}

/*info item*/
.info_wrap{ flex-shrink: 0; color: #666666; display: inline-flex; align-items: center}
.info_wrap .info{ font-size: 1rem; display: inline-flex; align-items: center}
.info_wrap .info img{ margin-right: 5px}
.info_wrap .info:after{ content: "|"; font-size: 0.875em; margin: 0 10px; position: relative; top: -0.1em}
.info_wrap .info:last-child:after{ display: none}

/*slick arrow*/
.slick-arrow-wrap{ padding: 0 50px}
.slick-arrow{ width: 50px; height: 100%; position: absolute; top: 0; cursor: pointer}
.slick-arrow.slick-disabled{ cursor: default; opacity: 0.3}
.slick-prev{ left: 0; background: url("/resource/templete/royal/img/common/icon_arr_l.png") no-repeat center;}
.slick-next{ right: 0; background: url("/resource/templete/royal/img/common/icon_arr_r.png") no-repeat center;}

@media screen and (max-width: 500px){
    .slick-arrow-wrap{ padding: 0 30px}
    .slick-arrow{ width: 30px}
}

/* [S] search input wrap*/
.search_input_wrap input::placeholder{ font-size: 1.125rem}
.search_input_wrap{ position: relative; max-width: 800px; margin: 0 auto; display: flex; align-items: center; border: solid 1px #000 !important; background: #fff}
.search_input_wrap select{ flex-shrink: 0; height: 60px; background: transparent url("/resource/templete/royal/img/common/arrow_down.png") no-repeat right 10px center / 12px auto; padding: 0 20px; min-width: 150px; color: #131313}
.search_input_wrap select option{ color: #131313}
.search_input_wrap form{ width: 100%; position: relative}
.search_input_wrap input[type="text"]{ width: 100%; height: 60px !important;display: block; font-size: 1.125rem;border: none !important; background: none; padding: 0 135px 0 15px}
.search_input_wrap .lang_btn{ width: 60px; height: 60px; display: inline-block;position: absolute; right: 60px;top: 0;background: url("/resource/templete/royal/img/common/ic_lang.png") no-repeat center}
.search_input_wrap .search_btn{ width: 60px; height: 60px; display: inline-block;position: absolute; right: 0;top: 0;background: #000 url("/resource/templete/royal/img/common/ic_search_w.png") no-repeat center / 50% auto;}
.autocomplete_layer{ position: absolute; left: 0; top: 61px; width: calc(100% - 60px); border: solid 1px #DDDDDD; border-top: none}
.autocomplete_layer .result_list{ padding: 20px 0; background: #fff}
.autocomplete_layer .result_item{ height: 35px; line-height: 35px;}
.autocomplete_layer .result_item a{ color: #666666; width: 100%; text-align: left; padding: 0 20px; }
.autocomplete_layer .result_item a:hover,
.autocomplete_layer .result_item a:focus{ background: rgba(247, 247, 247, 0.5); color: #131313}
.autocomplete_layer .btn_wrap{ height: 40px; display: flex; justify-content: flex-end; align-items: center; background: #F7F7F7; color: #949494; font-size: 0.875rem; padding: 0 10px}
.autocomplete_layer .btn_wrap button{ display: inline-flex; align-items: center}
.autocomplete_layer .btn_wrap button img{ margin-left: 3px}

@media screen and (max-width: 1024px){
    .search_input_wrap input,
    .search_input_wrap input::placeholder{ font-size: 1rem}

    .search_input_wrap select{ width: 100px; min-width: initial}
}
/* [E] search input wrap*/

.search_input_wrap form {
	width: 100%;
	display: flex;
	align-items: center;
}

.search_input_wrap input {
	color: #131313;
/*	padding-left: 15px*/
}

/* [S] util */
.util_wrap{ display: flex; align-items: center; justify-content: center; flex-shrink: 0}
.util_wrap .util_item{ width: 50px; height: 50px; margin: 0 5px}
.util_wrap .util_item > a{ width: 100%; height: 100%; border-radius: 50%; border: solid 1px #EAEAEA}
.util_wrap .util_item .qr{ background: url("/resource/templete/royal/img/common/ic_qr.png") no-repeat center}
.util_wrap .util_item .share{ background: url("/resource/templete/royal/img/common/ic_share.png") no-repeat center}
.util_wrap .util_item .print{ background: url("/resource/templete/royal/img/common/ic_print.png") no-repeat center}
/* [E] util */

/*공유하기*/
.share_wrap.trigger_wrap .trigger_toggle{ display: none}
.share_wrap.trigger_wrap.open .trigger_toggle{ width: auto; height: auto; padding: 15px 25px 25px; border-radius: 10px; background: #54565F; position: absolute; right: 0; top: 65px; display: block;}
.share_wrap.trigger_wrap .tit{ width: 100%; text-align: center; color: #fff; font-size: 1.125rem; margin-bottom: 25px;}
.share_wrap.trigger_wrap .share_list{ display: flex; align-items: center}
.share_wrap.trigger_wrap .share_item{ margin-left: 30px;}
.share_wrap.trigger_wrap .share_item:first-child{ margin-left: 0;}
.share_wrap.trigger_wrap .share_item a{ filter: brightness(1); width: 100%; height: 100%}
.share_wrap.trigger_wrap .share_item a.kakao{ background: url("/resource/templete/royal/img/common/icon_kakao.png") no-repeat center / 100% auto;}
.share_wrap.trigger_wrap .share_item a.blog{ background: url("/resource/templete/royal/img/common/icon_blog.png") no-repeat center / 100% auto;}
.share_wrap.trigger_wrap .share_item a.insta{ background: url("/resource/templete/royal/img/common/icon_insta.png") no-repeat center / 100% auto;}
.share_wrap.trigger_wrap .share_item a.facebook{ background: url("/resource/templete/royal/img/common/icon_facebook.png") no-repeat center / 100% auto;}
.share_wrap.trigger_wrap .share_item a.url{ background: url("/resource/templete/royal/img/common/icon_url.png") no-repeat center / 100% auto;}
.share_wrap .share_item{ width: 35px; height: 35px; border-radius: 50%; flex-shrink: 0}
.share_wrap .trigger_close{ position: absolute; right: 15px; top: 18px; width: 15px; height: 15px; background-color: transparent; opacity: 1}

/*카테고리 박스*/
.category_wrap{ display: flex; flex-wrap: wrap; align-items: center}
.category_wrap .category{ display: inline-flex; align-items: center; justify-content: center; height: 40px; border-radius: 20px; padding: 5px 25px; font-size: 1.250rem; font-weight: 500}
.category_wrap .category + .category,
.category_wrap span + span{ margin-left: 10px}

/* [S] lnb */
.lnb_wrap{ width: 300px; flex-shrink: 0; margin-right: 90px}
.lnb_tit{width: 100%;height: 85px;display: flex;flex-wrap: wrap;align-items: center;justify-content: center;text-align: center; font-size: 1.5rem;background: #131313; color: #fff;}
.lnb_depth2_wrap{ border: 1px solid #ddd; margin-bottom: 40px; padding: 20px;}
.lnb_depth2_item{ width: 100%;}
.lnb_depth2_item > a{width: 100%; font-size: 1.125rem; font-weight: 400; padding: 15px 0; position: relative;}
.lnb_depth2_item > a::before{width: 100%; height: 1px; background: #ddd; position: absolute; bottom: 0; left: 0;
content: '';}
.lnb_depth2_item:last-of-type > a::before{display: none;}
.lnb_depth2_item.active > a,
.lnb_depth2_item.current > a,
.lnb_depth2_item > a:hover{ font-weight: 600}
.lnb_depth2_item > a[target="_blank"]::after{content: url("/resource/templete/royal/img/common/ic_link2.png"); margin-left: 5px; vertical-align: text-top;}
.lnb_depth2_item .lnb_depth2_trigger{padding-right: 40px;}
.lnb_depth2_item .lnb_depth2_trigger:after{background: url("/resource/templete/royal/img/common/ic_lnb_arrow.png") no-repeat center / cover; width: 20px; height: 20px; position: absolute; right: 15px; top: 18px; transform: rotate(180deg); -webkit-transform: rotate(180deg); content: '';}
.lnb_depth2_item.active .lnb_depth2_trigger:after{transform: rotate(0); -webkit-transform: rotate(0);}
.lnb_depth2_item .lnb_depth3_wrap{ display: none}
.lnb_depth2_item:last-child .lnb_depth3_wrap{border-top: 1px solid #ddd;}
.lnb_depth2_item.active .lnb_depth3_wrap,
.lnb_depth2_item.current .lnb_depth3_wrap{ padding: 15px 20px; display: block; background: #f8f8f8; border-bottom: 2px solid #000;}
.lnb_depth3_item > a{ padding: 8px 0 8px 15px; width: 100%; font-size: 1rem; color: #555; position: relative}
.lnb_depth3_item > a::before{width: 5px; height: 5px; background: #000; position: absolute; left: 0; top: 15px; content: '';}
.lnb_depth3_item.current > a,
.lnb_depth3_item > a:hover,
.lnb_depth3_item > a:focus{ color: #131313; font-weight: 500}

.left_info_wrap{ width: 100%; background: #F8F8F8 url("/resource/templete/royal/img/sub/bg_left_info.png") no-repeat right bottom / 90% auto; padding: 40px 30px 70px}
.left_info_wrap .left_info_tit{ font-size: 1.750rem; font-weight: 600; margin-bottom: 20px}
.left_info_wrap .left_info_sub_tit{ font-size: 1.5rem; font-weight: 600; margin-bottom: 5px;}
.left_info_wrap .left_info_time{ margin-bottom: 45px}
.left_info_wrap .time{ font-size: 2.375rem; font-weight: 600; margin-bottom: 8px}
.left_info_wrap .closed_day{ font-size: 1.250rem; margin: 10px 0}
.left_info_wrap .small{ font-size: 1.063rem; color: #555}
/* [E] lnb */

/* [S] lnb 모바일*/
.sub_depth_mo{ display: flex; z-index: 20}
.sub_depth_mo .depth_list_wrap{ background: #131313; position: relative;}
.sub_depth_mo .depth3_list_wrap{ border-left: solid 1px #fdd;}
.sub_depth_mo .depth_list_wrap .trigger{ display: flex; align-items: center; color: #fff; justify-content: space-between; height: 60px; padding: 0 15px; font-size: 1.125rem;}
.sub_depth_mo .depth_list_wrap .trigger:after{ content: ""; width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 8px solid #fff; flex-shrink: 0; margin-left: 5px}
.sub_depth_mo .depth_list_wrap .trigger_toggle{ position: absolute; left: 0; top: 60px; width: 100%; background: #131313; z-index: 20}
.sub_depth_mo .depth_list_wrap .trigger_toggle li,
.sub_depth_mo .depth_list_wrap .trigger_toggle li a{ width: 100%}
.sub_depth_mo .depth_list_wrap .trigger_toggle li a{ display: flex; align-items: center; color: #fff; height: 60px; padding: 0 15px}

.sub_depth_mo .depth_list_wrap.open .trigger:after{ transform: rotate(180deg)}
/* [E] lnb 모바일*/

/* [S] breadcrumb */
.breadcrumb_list{ width: auto; margin-bottom: 20px}
.breadcrumb_list li,
.breadcrumb_list li a{ width: auto; display: inline-block}
.breadcrumb_list li{ position: relative; line-height: 30px; font-size: 0.750rem; color: #999999; font-weight: 500}
.breadcrumb_list li:before{
    content: "";
    width: 25px;
    height: 30px;
    display: block;
    float: left;
    background: url("/resource/templete/royal/img/common/arr_loc.png") no-repeat center;
}
.breadcrumb_list li:first-child:before{ display: none}
.breadcrumb_list li img{ width: 15px; position: relative; top: -2px}
.breadcrumb_list li.now{ color: #444444}
/* [E] breadcrumb */

/* [S] datepicker */
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active{ text-align: center; border: none; background: transparent; width: 30px; height: 30px}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus { border: none; background: transparent;}

.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover { top: 2px;}
.ui-datepicker .ui-datepicker-prev-hover { left: 2px;}
.ui-datepicker .ui-datepicker-next-hover { right: 2px;}

.datepicker{ width: 100%; min-height: 345px;}
.datepicker *{ font-family:'notosans', sans-serif !important;}
.ui-datepicker .ui-datepicker-header{ background: transparent; border: none; margin-bottom: 20px; color: #131313}
.ui-datepicker .ui-datepicker-prev{ background: url("/resource/templete/royal/img/common/arr_c_prev.png") no-repeat center; cursor: pointer}
.ui-datepicker .ui-datepicker-next{ background: url("/resource/templete/royal/img/common/arr_c_next.png") no-repeat center; cursor: pointer}
.ui-widget.ui-widget-content{ border: none; width: 100%}
.ui-widget.ui-widget-content td{ padding: 5px}
.ui-widget.ui-widget-content td a{ display: flex; align-items: center; justify-content: center; border-radius: 50%; margin: 0 auto}
.ui-widget.ui-widget-content td a.ui-state-highlight{ background: #F8F8F8; color: #131313}
.ui-widget.ui-widget-content td a.ui-state-active{ background: #131313; color: #fff}
/* [E] datepicker */