@charset "utf-8";
/* CSS Document */
.box0{ width:94%; margin:0 3%; max-width:1920px; min-width:1200px}
.box1{ width:1200px; margin:0 auto}

.r1024m,
.r1500m{ display:none}

.gnb li.m_hide{ display:none}

body:not(.pop){ display:flex; flex-wrap:wrap}

.pageLeft{ width:5em; position:sticky; left:0; top:0; height:100vh; box-sizing:border-box; padding:0 1em}
.pageLeft:before{ content:""; position:absolute; top:0; right:0; width:1px; height:100vh; background:#ddd}
.pageLeft .link > a{ display:block; text-align:center}
.pageLeft .link > a .img img{ width:100%}
.pageLeft .link > a .tt{ white-space:nowrap; writing-mode: vertical-lr; font-weight:700; font-size:1.063em; text-transform:uppercase}
.pageLeft .link > a .tt > i{ margin-bottom:.5em}
.pageLeft .link > a .tt > i.c1{ color:#333}
.pageLeft .link > a .tt > i.c2{ color:#999}
.pageLeft .link > a .tt > i.c3{ color:#00723E}
.pageLeft .link > a .ico{ width:1.5em; height:1.5em; display:flex; align-items:center; justify-content:center; text-align:center; background:#D6DF23; color:#fff; font-size:1em; border-radius:50%; margin:.5em auto}
.pageWrapper{ flex:1 1 0%; min-width:0; display:flex; flex-direction:column}
.pageWrapper #contents{ flex:1 1 0%; padding:0 0 3em 0}

#header{ position:sticky; width:100%; left:0; top:0; background:#fff; z-index:10}
.pageLeft .wrapH,
#header .wrapH,
#header .gnb_wrap .gnb > li .dp1{ height:5em}
#header .logo_wrap > a{ display:block}
#header .logo_wrap > a img{ height:1.375em; vertical-align:middle}
.logo img{ vertical-align:middle}
.logo .tt{ font-weight:700; font-size:1.25em; margin-left:.5em}
#header .gnb_wrap .gnb > li{ position:relative}
#header .gnb_wrap .gnb > li .dp1{ padding:.5em 2em; box-sizing:border-box}
#header .gnb_wrap .gnb > li .dp1 .va{ font-size:1.25em; font-weight:700}
#header .gnb_wrap .gnb > li.on .dp1,
#header .gnb_wrap .gnb > li:hover .dp1{ color:#00723E}
#header .gnb_wrap .gnb > li.more .dp1 .va{ position:relative}
#header .gnb_wrap .gnb > li.more .dp1 .va:after{ content:"\e942"; font-family:xeicon; margin-left:1em; vertical-align:middle}
#header .gnb_wrap .gnb > li ul{ position:absolute; width:14em; flex-direction:column; visibility:hidden; opacity:0; box-shadow:0 1em 1em rgba(0,0,0,.1)}
#header .gnb_wrap .gnb li:hover > ul{ visibility:visible; opacity:1}
#header .gnb_wrap .gnb > li .dp2{ left:50%; transform:translateX(-50%); top:calc(100% - 1px); padding:0 0 .5em 0; background:#fff;}
#header .gnb_wrap .gnb > li .dp2 li{ position:relative}
#header .gnb_wrap .gnb > li .dp2 li a{ display:block; text-align:left; position:relative; padding-right:1em;}
#header .gnb_wrap .gnb > li .dp2 li a:after{ font-family:xeicon; position:absolute; right:.5em; top:50%; transform:translateY(-50%); opacity:.6}
#header .gnb_wrap .gnb > li .dp2 li:hover > a:after{ opacity:1}
#header .gnb_wrap .gnb > li .dp2 > li > a{ padding:.375em; margin:1px .5em; margin-right:0; color:#666; font-weight:500}
#header .gnb_wrap .gnb > li .dp2 > li.more > a:after{ content:"\e914"}
#header .gnb_wrap .gnb > li .dp2 > li.more:hover > a:after{ content:"\e93f"}
#header .gnb_wrap .gnb > li .dp2 > li:hover > a{ background:#00723E; color:#fff}
#header .gnb_wrap .gnb > li .dp2 > li .dp3{ left:100%; top:1px; background:#00723E; padding:.5em .25em; color:#fff}
#header .gnb_wrap .gnb > li .dp2 > li .dp3 > li > a{ padding:.25em .5em; margin:1px .25em; font-weight:500}
#header .gnb_wrap .gnb > li .dp2 > li .dp3 > li > a .va{ font-size:.938em}
#header .gnb_wrap .gnb > li .dp2 > li .dp3 > li > a:after{ content:"\e907"; font-size:.75em}
#header .gnb_wrap .gnb > li .dp2 > li .dp3 > li > a:hover{ background:#fff; color:#00723E}
#header .etc_wrap .btnSt{ font-weight:500; color:#00723E; margin:0 2em}
#header .etc_wrap .btnSt .xi{ width:1.5em; line-height:1.5em; border-radius:50%; background:#D6DF23; text-align:center; color:#fff; margin-right:.25em}
#header .all_wrap .allBtn{ width:3em; line-height:3em; text-align:center}
#header .all_wrap .allBtn .xi{ font-size:2.25em}
#header .all_wrap .all{ position:fixed; right:0; top:0; width:100%; height:100vh; opacity:0; visibility:hidden; z-index:1}
#header .all_wrap .all .wrap_bg{ height:100%; background:rgba(0,0,0,.7); position:relative; opacity:0}
#header .all_wrap .all .wrap_bg .btn{ position:absolute; right:1em; top:2.5em; width:3em; line-height:3em; background:#fff; border-radius:50%; color:#111; text-align:center}
#header .all_wrap .all .wrap_in{ height:100%; width:90%; max-width:22em; background:#fff; display:block; transform:translateX(100%); overflow-x:hidden}
#header .all_wrap .all .top{ padding:3em 1em; background:#f5f5f5}
#header .all_wrap .all .top .logo img{ height:2.25em;}
#header .all_wrap .all .wrapSec{ position:relative; padding-top:.75em}
#header .all_wrap .all .wrapSec:before{ content:""; position:absolute; left:0; top:0; width:100%; height:.75em; background:#f5f5f5; border-top:1px solid #ddd}
#header .all_wrap .all .bottom{}
#header .all_wrap .all .bottom .link{ padding:0 0 1px 0}
#header .all_wrap .all .bottom .link > li{ flex:1 1 auto; width:50%}
#header .all_wrap .all .bottom .link > li > a{ height:3.5em; position:relative; border:1px solid #eee; margin:0 -1px -1px 0; font-size:.938em; color:#777}
#header .all_wrap .all .bottom .link > li > a .t1{ font-weight:500; margin-left:.5em}
#header .all_wrap .all .bottom .link > li > a:hover{ color:#D6DF23}
#header .all_wrap .all .bottom .etc{ margin-top:2em}
#header .all_wrap .all .bottom .etc > li > a{ font-size:.938em; color:#777}
#header .all_wrap .all .menu .flex{ display:block}
#header .all_wrap .all .gnb a{ text-align:left; position:relative}
#header .all_wrap .all .gnb li{ position:relative}
#header .all_wrap .all .gnb li.more > .layer{ position:absolute; left:0; top:0; width:100%; height:100%; z-index:1; cursor:pointer}
#header .all_wrap .all .gnb a .arrow{ position:absolute; right:1em; top:50%; line-height:2em; margin-top:-1em; transition:.3s}
#header .all_wrap .all .gnb a .arrow:before{ content:"\e907"; font-size:.75em}
#header .all_wrap .all .gnb li.more > a .arrow:before{ content:"\e943"; font-size:1em}
#header .all_wrap .all .gnb > li .dp1{ padding:0 1.5em; height:4em}
#header .all_wrap .all .gnb > li .dp1 .va{ font-size:1.125em; font-weight:500}
#header .all_wrap .all .gnb > li:not(.on):hover .dp1{ color:#00723E}
#header .all_wrap .all .gnb > li.more .dp1 + .layer{ height:5em}
#header .all_wrap .all .gnb > li .dp2{ padding:1em 0; margin-bottom:-1px; border-bottom:1px solid #ddd}
#header .all_wrap .all .gnb > li .dp2 > li > a{ padding:.75em 1.5em; font-weight:500; transition:.3s}
#header .all_wrap .all .gnb > li .dp2 > li > a .arrow{ right:.875em; width:1.25em; line-height:1.25em; border-radius:50%; text-align:center}
#header .all_wrap .all .gnb > li .dp2 > li > a .va{ font-size:1.063em}
#header .all_wrap .all .gnb > li .dp2 > li.more > a .arrow{ display:none}
#header .all_wrap .all .gnb > li .dp2 > li:hover > a,
#header .all_wrap .all .gnb > li .dp2 > li.on > a{ color:#00723E}
#header .all_wrap .all .gnb > li .dp2 > li > a:hover .arrow{ background:#00723E; color:#fff}
#header .all_wrap .all .gnb > li .dp3{ background:rgba(255,255,255,.9); border-radius:.5em; padding:0 1em; margin-bottom:1em}
#header .all_wrap .all .gnb > li .dp3 > li > a{ padding:.375em .5em; color:#777}
#header .all_wrap .all .gnb > li .dp3 > li > a .va{ font-size:.938em}
#header .all_wrap .all .gnb > li .dp3 > li > a .arrow{ right:.5em}
#header .all_wrap .all .gnb > li .dp3 > li:hover > a,
#header .all_wrap .all .gnb > li .dp3 > li.on > a{ color:#00723E}
#header .all_wrap .all .gnb > li .dp3 > li.on > a .arrow:before{ content:"\e91a"}
#header .all_wrap .all .gnb .dp2{ display:none}
#header .all_wrap .all .gnb > li.on > a{ background:#00723E; color:#fff}
#header .all_wrap .all .gnb > li.on > a .arrow{ transform:rotate(180deg)}
#header .all_wrap .all .gnb > li.on > ul{ background:#fff; display:block}
.allGnbOn{ overflow-y: hidden}
.allGnbOn body{ overflow-y: scroll}
.allGnbOn #header .top_wrap{ z-index:11}
.allGnbOn #header .all_wrap .all{ opacity:1; visibility:visible}
.allGnbOn #header .all_wrap .all .wrap_bg{ opacity:1; transition:.3s; transition-delay:.2s}
.allGnbOn #header .all_wrap .all .wrap_in{ transform:translateX(0); transition:.3s}

#footer{ background:#181a23; width:100%; z-index:1}
#footer .siteSlider_wrap{ border-top:1px solid #eee; background:#fff}
#footer .siteSlider .el{ width:12.5%}
#footer .siteSlider .el .img{ padding: 1em; filter: grayscale(1); opacity: .5; transition:.3s}
#footer .siteSlider .el .img .resize{ padding-bottom:40%; background-size: 100% auto}
#footer .siteSlider .el:hover .img{ filter: grayscale(0); opacity: 1}
#footer .menu_wrap{ border-bottom:1px solid rgba(255,255,255,.05); color:#fff}
#footer .menu_wrap .wrapH{ height:4.25em}
#footer .menu_wrap .menu > li > a{ margin-right:2.5em}
#footer .menu_wrap .menu > li > a:hover{ text-decoration:underline}
#footer .menu_wrap .menu > li > a.point{ color:#c9a07d}
#footer .menu_wrap .sns > li > a{ width:3.5em}
#footer .info_wrap{ padding:3em 0 ; color:#fff}
#footer .info_wrap .info > li{ float:left; margin-right:2.5em; margin-bottom:.75em; opacity:.9; letter-spacing:0;}
#footer .info_wrap .info > li.br{ clear:left}
#footer .info_wrap .info > li.copyright{ font-size:.813em; font-weight:300; opacity:.5; text-transform:uppercase; margin-top:1em}
#footer .info_wrap .info:after{ content:""; display:block; clear:both}
#footer .info_wrap .site{ width:12em; position:relative; margin-right:4em}
#footer .info_wrap .site .siteBtn{ box-sizing:border-box; background:#07080d; height:3em; padding:0 1.5em; justify-content:space-between}
#footer .info_wrap .site .siteBtn .arrow{ transition:.3s}
#footer .info_wrap .site .list{ position:absolute; left:0; bottom:100%; width:100%; padding:1em; background:#07080d; box-sizing:border-box; border-bottom:1px solid rgba(0,0,0,1); opacity:0; visibility:hidden; transition:.3}
#footer .info_wrap .site .list > li > a{ padding:.5em; display:block; position:relative; transition:.3s}
#footer .info_wrap .site .list > li > a .t1{ font-size:.938em}
#footer .info_wrap .site .list > li > a .icon{ font-size:.875em; position:absolute; right:1em; top:50%; transform:translateY(-50%); margin-top:-1px; opacity:0; transition:.3s}
#footer .info_wrap .site .list > li > a .icon:before{ content:"\e980"}
#footer .info_wrap .site .list > li > a:hover{ background:#00723E;}
#footer .info_wrap .site .list > li > a:hover .icon{ opacity:1}
#footer .info_wrap .site.on .list{ opacity:1; visibility:visible}
#footer .info_wrap .site.on .siteBtn .arrow{ transform:rotate(225deg)}
#footer .goTop{ position:fixed; z-index:1; right:3em; bottom:4.5em; width:3em; line-height:3em; background:#00723E; color:#fff; text-align:center; box-shadow:0 0 1em rgba(0,0,0,.1); transform:translateY(100%); opacity:0; visibility:hidden; transition:1s}
.scroll #footer .goTop{ opacity:1; visibility:visible; transform:translateY(0)}

#contents{ display:flex; align-items:flex-start}
.sub #contents{ padding:2em 0 8em 0}
#contents .subLnbWrap{ width:21em; margin-right:4em; position:sticky; left:0; top:5em; overflow-y:auto}
#contents .subLnbWrap .lnb_tit{ position:relative; padding-bottom:2em; padding-right:3em; border-bottom:.25em solid #eee}
#contents .subLnbWrap .lnb_tit:before,
#contents .subLnbWrap .lnb_tit:after{ content:""; position:absolute; left:0; top:100%; height:.25em; width:2em; background:#00723E}
#contents .subLnbWrap .lnb_tit:after{ transform:translateX(100%); background:#D6DF23}
#contents .subLnbWrap .lnb_tit .t1{ font-weight:500; color:#00723E; margin-bottom:.5em}
#contents .subLnbWrap .lnb_tit .t2{ font-weight:700; font-size:1.5em; line-height:1.1}
#contents .subLnbWrap .lnb_tit .ico{ position:absolute; right:0; bottom:2em; width:3.5em; height:3.5em; background:#; border-radius:50%; display:flex; align-items:center; justify-content:center}
#contents .subLnbWrap .lnb_tit .ico img{ height:100%; filter:grayscale(1); opacity:.2}
#contents .subLnbWrap .gnb{ border-bottom:1px solid #ddd}
#contents .subLnbWrap .gnb,
#contents .subLnbWrap .gnb .flex{ display:block}
#contents .subLnbWrap .gnb li > a{ text-align:left; padding-right:1.5em; position:relative; line-height:1.2}
#contents .subLnbWrap .gnb li > a:after{ font-family:xeicon; position:absolute; right:.75em; top:50%; line-height:1em; margin-top:-.5em; width:1.5em; text-align: right}
#contents .subLnbWrap .gnb li.on > a:after{ content:"\ea40"}
#contents .subLnbWrap .gnb li.on:not(.more) > a:after{ transform:scale(1.2)}
#contents .subLnbWrap .gnb > li .dp1{ display:flex; align-items:center; height:3.5em; border-top:1px solid #ddd; font-weight:700}
#contents .subLnbWrap .gnb > li .dp1 > .va{ position:relative; transition:.3s}
#contents .subLnbWrap .gnb > li:hover .dp1,
#contents .subLnbWrap .gnb > li.on .dp1{ color:#00723E}
#contents .subLnbWrap .gnb > li.more .dp1:after{ content:"\e943"}
#contents .subLnbWrap .gnb > li .dp2{ background:#f5f5f5; padding:.75em 0}
#contents .subLnbWrap .gnb > li .dp2 > li > a{ display:block; padding:.5em 1.25em; font-weight:500; color:#777}
#contents .subLnbWrap .gnb > li .dp2 > li > a .va{ font-size:.938em}
#contents .subLnbWrap .gnb > li .dp2 > li:hover > a ,
#contents .subLnbWrap .gnb > li .dp2 > li.on > a{ color:#00723E}

#contents .subDocWrap{ flex:1 1 0%; min-width:0}
#contents .sub_tit{ height:5em; box-sizing:border-box; padding-top:.5em; display:flex; align-items:baseline; flex-wrap:wrap}
#contents .sub_tit .tt{font-weight:500; font-size:2.5em}
#contents .sub_tit .tt + .tt{ font-size:1.375em; margin-left:.5em; padding-left:1.5em; position:relative}
#contents .sub_tit .tt + .tt:before{ content:""; position:absolute; left:0; top:50%; height:2px; width:1em; transform:translateY(-50%); background:#ddd}
#contents .sub_nav{ position:relative}
#contents .sub_nav:before{ content:""; position:absolute; left:0; top:50%; height:1px; width:100%; background:#ddd}
#contents .sub_nav > li{ font-size:.875em; backdrop-filter:blur(1em); color:#888}
#contents .sub_nav > li.home .xi{ font-size:1em; padding-left:1em}
#contents .sub_nav > li:before{ content:"\e940"; font-family:xeicon; padding:0 .5em; vertical-align:middle}
#contents .sub_nav > li:first-child:before{ display:none}

.dp1on .gnb .dp2{ display:none!important}
.dp2on .gnb > li,
.dp2on .gnb > li .dp1,
.dp2on .gnb > li .dp3{ display:none!important}
.dp2on .gnb > li.on{ display:block!important}
.dp3on .gnb > li,
.dp3on .gnb > li .dp1,
.dp3on .gnb > li .dp2 > li,
.dp3on .gnb > li .dp2 > li > a{ display:none!important}
.dp3on .gnb > li.on,
.dp3on .gnb > li .dp2 > li.on{ display:block!important}

.logoTT{ vertical-align:baseline}
.h100{ height:100%}

#contents .doc{ padding:3em 0 0 0}

/**/
.login_wrap .login{ width:30em; max-width:94%; margin:0 auto}
.login_wrap .login .wrap_tit{ margin:1em 0 2em 0}
.login_wrap .login .wrap_tit .t1{ color:#00723E; font-weight:700; font-size:1.75em}
.login_wrap .login .wrap_tit .t2{ color:#777; margin:.25em 0; font-size:1.063em}

.login_wrap .link_wrap{ padding:0 .5em; margin:1em 0}
.login_wrap .link_wrap .link{ font-size:.938em; margin:0 1em; color:#666}
.login_wrap .link_wrap .link .tt{ padding:0 .25em; display:inline-block}
.login_wrap .link_wrap .link:hover .tt{ text-decoration:underline; color:#111}

.login_wrap .check_wrap{ margin:1em 0 0 0}
.login_wrap .btn_wrap{ margin-top:3em}
.login_wrap .btn_wrap + .btn_wrap{ margin-top:.5em}
.login_wrap .btn_wrap .btn{ padding:0 2em; height:3.5em; box-shadow:1px 1px 2px rgba(0,0,0,.2); background:#00723E; color:#fff; border:none; width:100%; box-sizing:border-box; border:2px solid transparent; margin-bottom:.5em; font-size:1.063em; font-weight:500; border-radius:.25em}
.login_wrap .btn_wrap .btn.c1{ border-color:#333; color:#333; background:#fff}
.login_wrap .btn_wrap .btn.c2{ background:#fff; color:#00723E; border-color:#00723E}
.login_wrap .btn_wrap .btn.s1{ font-size:1.25em}
.login_wrap .btn_wrap .btn.s2{ font-size:.875em}
.login_wrap .btn_wrap .btn.w1{ width:49%}
.login_wrap .tt_st{ color:#00723E}

.form_wrap{ border:1px solid #ddd; border-radius:1em; padding:3em}
.form_wrap .tit_wrap{ float:left; width:20%}
.form_wrap .tit_wrap .in{ border-top:2px solid #333; padding:1.125em}
.form_wrap .con_wrap{ float:right; width:75%}

.form_st{}
.form_st > li{ margin-top:1em}
.form_st > li:first-child{ margin-top:0}
.form_st > li .in{ position:relative; padding:0 1em 0 4em; margin-top:.5em}
.form_st > li .in .icon{ position:absolute; left:0; top:50%; width:3em; line-height:3em; margin-top:-1.5em; text-align:center; color:#666}
.form_st > li .in .icon:before{ font-size:1.313em}
.form_st > li .in .lab{ position:absolute; left:4em; top:50%; line-height:1em; margin-top:-.5em; color:#999; background:#fff; padding:0 .25em}
.form_st > li .in .inp{ width:100%; box-sizing:border-box; padding:1em 0; height:4em; border:none; position:relative; z-index:1; background:none; font-weight:bold; color:#666}
.form_st > li .in .inp[type=file]{ padding:0 !important; height:3em}
.form_st > li .in .inp[readonly=readonly]{ background:#f5f5f5}
.form_st > li .in textarea.inp{ height:10em !important; padding:1em !important; margin:.5em; width:calc(100% - 1em)}
.form_st > li .in textarea.inp.h1{ height:23.25em !important}
.form_st > li .in .line{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; border:1px solid #ddd; box-sizing:border-box; transition:.3s; border-radius:.25em}
.form_st > li .in .inp:focus ~ .lab,
.form_st > li .in .inp.on ~ .lab{ transform:scale(.9,.9); top:0; color:#00723E; margin-left:-.5em; transition:.3s}
.form_st > li .in .inp:focus ~ .icon,
.form_st > li .in .inp.on ~ .icon{ color:#333}
.form_st > li .in .inp:focus ~ .line,
.form_st > li .in .inp.on ~ .line{ border-color:#00723E}
.form_st > li .in .inp.c1{ background:#f1f1f1}

.form_st.st1 > li{ display:flex; flex-wrap:wrap; align-items:center}
.form_st.st1 > li:not(.btn_wrap){ margin-top:1.5em}
.form_st.st1 > li.line{ margin-top:1.25em; padding-top:1.25em; border-top:1px solid #00723E}
.form_st.st1 > li.line > .label_st{ width:100%; margin-top:-1em}
.form_st.st1 > li.line2{ border-top:1px solid #ddd; padding-top:1em !important}
.form_st.st1 > li .in{ padding:0; flex:1 1 1%; min-width:0; word-break:break-all}
.form_st.st1 > li .in_sec{ width:1.5em; text-align:center; color:#999; display:inline-block}
.form_st.st1 > li .in_sec2{ width:.5em}
.form_st.st1 > li .in_br{ flex-basis:100%}
.form_st.st1 > li .in_tit{ font-weight:500; font-size:1.063em; color:#333; width:100%}
.form_st.st1 > li .in_tit .ess:before{ font-size:.875em; margin-left:.5em}
.form_st.st1 > li .in_tit.c1{ color:#777}
.form_st.st1 > li .in_tit.s1{ font-size:1.25em}
.form_st > li .in_tt{ width:100%; color:#777; font-size:.938em; margin-top:1em; line-height:1.5}
.form_st.st1 > li .in.fix{ flex:0 0 auto}
.form_st.st1 > li .in .inp{ padding:1em 1em; height:3.5em; font-size:.938em;font-weight:400}
.form_st.st1 > li .in .inp[type=file]{ height:3em}
.form_st.st1 > li .in .inp.s1{ font-size:1em}
.form_st.st1 > li .in .btn{ color:#fff}
.form_st.st1 > li .in .btn + .line{ background:#999; border-color:transparent}
.form_st.st1 > li .in .w100{ width:100%}
.form_st.st1 > li .in.w1{ max-width:26%}
.form_st.st1 > li .in.w50{ max-width:50%}
.form_st.st1 > li .in.w100{ flex-basis:100%}
.form_st.st1 > li .agree{ border:1px solid #ddd; width:100%; margin:.75em 0; border-radius:.25em}
.form_st.st1 > li .agree > li{ padding:.75em 1em; position:relative; transition:.3s}
.form_st.st1 > li .agree > li.all{ border-bottom:1px solid #ddd}
.form_st.st1 > li .agree > li .more{ background:#aaa; color:#fff; padding:.25em 1em; font-size:.875em}
.form_st.st1 > li .agree > li .more:before{ content:"\e941"; font-family:xeicon,score,sans-serif}
html.ko .form_st.st1 > li .agree > li .more:before{ content:"보기"}
.form_st.st1 > li .agree > li .agree_box{ display:none}
.form_st.st1 > li .agree > li .on .more{ background:#333}
.form_st.st1 > li .agree > li .on .more:before{ content:"\e944"}
html.ko .form_st.st1 > li .agree > li .on .more:before{ content:"접기"}
.form_st.st1 > li .agree > li .on .agree_box{ display:block}
.form_st.st1 > li.flex{ padding:0 .5em}
.form_st.st1 > li.flex .in_tit{ flex-basis:8em; font-size:.938em; padding-left:0; height:4em; display:flex; align-items:center}
.form_st.st1 > li.flex .in{ margin-top:0}
.form_st.st1 > li.flex .in.w100{ margin-left:8em}
.form_st.st1 > li.flex .in .inp{ font-size:.938em}

.form_st.s1{ font-size:.938em}

.form_st.text{ border-bottom:1px solid #ddd}
.form_st.text > li{ border-top:1px solid #ddd; margin-top:0}
.form_st.text > li .in .t1{ font-size:.938em; color:#666}
.form_st.text > li .in a:hover{ text-decoration:underline}

.form_st_wrap > ul{ width:48%}

.fin_wrap{ border:1px solid #ddd; padding:2em 4em 4em 4em; text-align:center; box-sizing:border-box}
.fin_wrap.p1{ padding:2em}
.fin_wrap.w1{ width:70em; margin:0 auto; max-width:94%; padding:2em 2em 4em 2em;}
.fin_wrap .fin_icon{ opacity:.1; font-size:4em}
.fin_wrap .fin_tit{ font-weight:300; font-size:1.875em;}
.fin_wrap .fin_tit:after{ content:""; display:block; margin:.75em auto; width:1em; height:1px; background:#aaa}
.fin_wrap .fin_tt{ color:#888; line-height:1.6}
.fin_wrap .fin_tt.t1{ color:#666; font-size:1.188em}

.fin_wrap.st1{ border:none; padding:0}

.agree_box{ border:1px solid #ddd; box-shadow:1px 1px 1em rgba(0,0,0,.2); padding:3em}
.agree_box .tit{ font-size:1.188em; font-weight:500; color:#111; margin-bottom:1em; margin-top:2em}
.agree_box .tit:first-child{ margin-top:0}
.agree_box .con{ font-size:.938em; color:#666; line-height:1.8em}
.agree_box .con.h1{ height:10.8em; overflow-y:auto}
.agree_box .con > *{ margin-top:1em}
.agree_box .con *{ vertical-align: top}
.agree_box .check{ border-top:1px solid #ddd; margin-top:1.5em; padding-top:1em}
.agree_box.st1{ box-shadow:none; padding:1em; background:#f9f9f9}
.agree_box.st1 .con{ font-size:.875em}

label_st.agree_box ul{ margin-top:1em}
.agree_box table{ margin:1em 0; width:100%}
.agree_box table th,
.agree_box table td{ border:1px solid #ddd; padding:1em}
.agree_box table th{ background:#f5f5f5}
.agree_box p strong{ font-size:1.125em; color:#333}
.agree_box a{ vertical-align:top; color:#666; text-decoration:underline}
.agree_box a:hover{ opacity:.6}
.agree_box strong{ vertical-align:top; font-weight:500}

/**/
.class_list{ display:flex; gap:1em; flex:1 1 0%; min-width:0}
.class_list > li{ flex:1 1 1%}
.class_list > li .wrap_in{ position:relative; display:flex; justify-content:center; align-items:center; overflow:hidden}
.class_list > li .wrap_in .bg{ position:absolute; left:0; top:0; width:100%; height:100%}
.class_list > li .wrap_in .bg:after{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(255,255,255,.8); backdrop-filter:blur(1em)}
.class_list > li .wrap_in .con{ position:relative; box-sizing:border-box; width:100%; padding:2em}
.class_list > li .wrap_in .con .tit{ padding:1em 0; text-align:center; position:relative}
.class_list > li .wrap_in .con .tit:before,
.class_list > li .wrap_in .con .tit:after{ content:""; display:block; position:absolute; left:50%; top:100%; width:2em; margin-left:-1em; height:1px; background:#111}
.class_list > li .wrap_in .con .tit:after{ transform:rotate(90deg)}
.class_list > li .wrap_in .con .tit .t1{ font-weight:800; font-size:2.5em;}
.class_list > li .wrap_in .con .tit .t2{ margin:.5em 0 2em 0; font-size:1.063em; color:#666}
.class_list > li .wrap_in .con .list{ display:none; gap:.5em; flex-wrap:wrap; margin-top:2em}
.class_list > li .wrap_in .con .list > li{ width:100%}
.class_list > li .wrap_in .con .list > li > a{ display:flex; overflow:hidden; position:relative; padding:1em; box-sizing:border-box; align-items:center; border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.2); backdrop-filter:blur(.25em); transition:.3s}
.class_list > li .wrap_in .con .list > li > a .ico{ display:flex; width:2.5em; margin-right:1em; justify-content:center}
.class_list > li .wrap_in .con .list > li > a .ico img{ height:100%; filter:brightness(0) invert(1)}
.class_list > li .wrap_in .con .list > li > a .tt{ flex:1 1 0%; min-width:0}
.class_list > li .wrap_in .con .list > li > a .t1{ font-weight:500; font-size:1.125em; line-height:1.1}
.class_list > li .wrap_in .con .list > li > a .arrow{ position:absolute; right:1em; top:50%; transform:translateY(-50%); font-size:1em; opacity:0; margin-right:-2em; transition:.3s}
.class_list > li .wrap_in .con .list > li > a:hover{ background:#00723E; color:#fff; border-color:transparent}
.class_list > li .wrap_in .con .list > li > a:hover .arrow{ margin-right:0; opacity:1}
.class_list > li .wrap_in:hover{ color:#fff}
.class_list > li .wrap_in:hover .bg{ opacity:1; background-size:contain}
.class_list > li .wrap_in:hover .bg:after{ background:rgba(0,0,0,.1); backdrop-filter:blur(0); transition:1s}
.class_list > li .wrap_in:hover .con .tit:before,
.class_list > li .wrap_in:hover .con .tit:after{ background:#fff}
.class_list > li .wrap_in:hover .con .tit:after{ transform:rotate(0); transition:transform .5s}
.class_list > li .wrap_in:hover .con .tit .t2{ display:none}
.class_list > li .wrap_in:hover .con .list{ display:flex}

.page_tit{ margin:5em 0 1em 0}
.page_tit:first-child{ margin-top:0}
.page_tit .t1{ font-weight:700; font-size:1.313em; position:relative}
.page_tit .t1:before{ content:""; width:.5em; height:.5em; background:#D6DF23; border-radius:50%; position:absolute; box-sizing:border-box; top:0; left:0; transform:translate(-50%,-25%)}
.page_tit .t1 > i{ position:relative; display:inline-block; line-height:1.1}