@charset "utf-8";/* CSS Document */
.box0 { padding: 0 2.5vw; box-sizing: border-box}
.box1 { padding: 0 5vw; box-sizing: border-box; max-width: 1680px; margin: 0 auto}
.boxSub,
.box2 { box-sizing: border-box; width: 1280px; margin: 0 auto; max-width: 100%; } 

.gnb li.m_hide { display: none}
body:not(.pop) { display: flex; flex-direction: column; min-height: 100vh; min-height: calc(var(--vh, 1vh) * 100)}

#header { position: fixed; left: 0; top: 0; width: 100%; z-index: 1000; background: #fff}
#header .top_wrap { position: relative}
#header .top_wrap .wrapH,
#header .top_wrap .gnb_wrap .dp1 { height: var(--headerHS)}
.headerT { padding-top: var(--headerHS)}
#header .top_wrap .wrapF { display: flex; align-items: center; gap: 0 4vw}
#header .top_wrap .wrapF > * { position: relative; z-index: 2}
#header .top_wrap .logo { height: 3.7em}
#header .top_wrap .logo > a { display: block; height: 100%; overflow: hidden}
#header .top_wrap .logo > a .in { display: block; height: 100%; transition: .5s}
#header .top_wrap .logo > a img { height: 100%; display: block}
#header .top_wrap .etc_wrap { display: flex; align-items: center; gap: 2vmin}
#header .top_wrap .etc_wrap .btnInc { width: 4em; height: var(--headerH); display: flex; align-items: center; justify-content: center}
#header .top_wrap .etc_wrap .btnInc .ico { font-size: 1.75em}
#header .top_wrap .etc_wrap .btnInc.allBtn .ico { font-size: 2.25em}
#header .top_wrap .etc_wrap .mem_wrap { border-radius: 3em; overflow: hidden; display: flex; align-items: center; gap: 2em; box-shadow: 0 0 1em rgba(0, 0, 0, .1) inset; border: 1px solid transparent; color: #666}
#header .top_wrap .etc_wrap .mem_wrap > li > a { display: flex; align-items: center; position: relative; height: 2.5em; gap: .25em}
#header .top_wrap .etc_wrap .mem_wrap > li:first-child > a { padding-left: 1.5em}
#header .top_wrap .etc_wrap .mem_wrap > li:last-child > a { padding-right: 1.5em}
#header .top_wrap .etc_wrap .mem_wrap > li:not(:first-child) > a:after { content: ""; position: absolute; left: -1em; top: 50%; transform: translateY(-50%); width: 1px; height: 1em; background: #ddd}
#header .top_wrap .etc_wrap .mem_wrap > li > a .tt { font-size: .938em; font-weight: 500}
#header .top_wrap .etc_wrap .mem_wrap > li > a .ico { font-size: 1em; } 

html:not(.allOn) #header .top_wrap .gnb_wrap { display: flex; align-items: center; flex: 1; min-width: 0; justify-content: center; height: 100%; z-index: 1}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb { position: absolute; left: 50%; transform: translateX(-50%); top: 0; width: 100%; justify-content: center; box-sizing: border-box}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb:before { content: ""; position: fixed; width: 100vw; background: #fff; top: var(--headerHS); height: 0; opacity: 0; box-sizing: border-box; border-top: 1px solid #eee; box-shadow: 0 1em 1em rgba(0, 0, 0, .1)}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb a { display: flex; justify-content: center; } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li:not(.m_hide) { position: relative; flex: 1; border-right: 1px solid transparent; max-width: 20vmin; display: flex; flex-direction: column}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li:first-child { border-left: 1px solid transparent}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp1 { display: flex; align-items: center; justify-content: center}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp1 .tt { font-weight: 700; font-size: 1.25em}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp1 .va { position: relative}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp1:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 4px; background: var(--siteC); transform: scaleX(0); } 
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2 { padding: 1.5em 0 3em 0; flex: 1; opacity: 0; visibility: hidden; z-index: -100; position: absolute}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2:before { content: ""; position: absolute; left: 0; top: 0; width: calc(100% + 2px); height: 0; border: 1px solid #eee; box-sizing: border-box; border-top: none; border-bottom: none}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2 > li { position: relative}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a { padding: .25em 1em; color: #777; text-align: center}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a .tt { font-weight: 500}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a:hover { color: #111}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li .dp2 > li > a:hover .tt { text-decoration: underline}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li:hover .dp1,
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li.on .dp1 { color: var(--siteC)}
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li:hover .dp1:after,
html:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li.on .dp1:after { transform: scaleX(1); transition: .3s}
html:not(.allOn) #header .top_wrap .gnb_wrap.active .gnb:hover > li { max-width: 20vmin; transition: .3s; transition-delay: .1s; transition-timing-function: ease-in-out}
html:not(.allOn) #header .top_wrap .gnb_wrap.active .gnb:hover:before { height: calc(100% - var(--headerHS)); opacity: 1; transition: height .3s; transition-delay: .1s; transition-timing-function: ease-in-out}
html:not(.allOn) #header .top_wrap .gnb_wrap.active .gnb:hover > li .dp2 { position: relative; opacity: 1; visibility: visible; z-index: auto; transition: .3s; transition-delay: .3s}
html:not(.allOn) #header .top_wrap .gnb_wrap.active .gnb:hover > li .dp2:before { height: 100%; transition: .3s; transition-delay: .4s}

#header .top_wrap .gnb_wrap .gnb > li .dp2 { flex-direction: column; gap: .5em}

html.scroll:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li.on .dp1 { color: var(--siteC)}
html.scroll:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li.on .dp1 .va:after { opacity: 1; transition: .3s}
html.scroll:not(.allOn) #header .top_wrap .gnb_wrap .gnb > li:hover .dp2 { visibility: visible; opacity: 1; z-index: auto; transition: .2s; } 

html.scroll:not(.up) #header { transform: translateY(-100%); transition: none}
html.scroll:not(.up) #header .top_wrap .gnb_wrap .gnb { display: none}
html.up.scroll #header { box-shadow: 0 1em 1em rgba(0, 0, 0, .1)}

html:not(.scroll):not(.allOn):not(.d1) #header:not(:hover) { background: none; color: #fff; box-shadow: none}
html:not(.scroll):not(.allOn):not(.d1) #header:not(:hover) .top_wrap .logo { filter: brightness(0) invert(1)}
html:not(.scroll):not(.allOn):not(.d1) #header:not(:hover) .top_wrap .gnb_wrap .gnb > li.on .dp1 { color: #fff}
html:not(.scroll):not(.allOn):not(.d1) #header:not(:hover) .top_wrap .gnb_wrap .gnb > li .dp1:after { background: #fff}
html:not(.scroll):not(.allOn):not(.d1) #header:not(:hover) .top_wrap .etc_wrap .mem_wrap { border-color: rgba(255, 255, 255, .5); color: #fff}
html:not(.scroll):not(.allOn):not(.d1) #header:not(:hover) .top_wrap .etc_wrap .mem_wrap > li:not(:first-child) > a:after { background: rgba(255, 255, 255, .5)}

.allOn { overflow: hidden}
.allOn #header { height: 100vh; position: fixed; box-sizing: border-box; overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--scrollBar); background: #fff}
.allOn #header .top_wrap .wrapH,
.allOn #header .top_wrap .wrapF { height: 100%}
.allOn #header .top_wrap .logo { display: flex; align-items: center; height: 3.7em}
.allOn #header .top_wrap:before { content: ""; position: fixed; right: 50%; bottom: 50%; background: #f5f5f5; border-radius: 50%}
.allOn #header .top_wrap .wrapF { flex-direction: column; align-items: flex-start; gap: 5vmin; padding: 5vmin}
.allOn #header .gnb_wrap { flex: 1; min-height: 0; width: 100%; margin-left: 0; order: 10}
.allOn #header .gnb_wrap .gnb { flex-wrap: wrap; gap: 5vmin; align-items: flex-start}
.allOn #header .gnb_wrap .gnb a { text-align: left; display: flex; box-sizing: border-box; line-height: 1.2}
.allOn #header .gnb_wrap .gnb > li { box-sizing: border-box; flex: 1}
.allOn #header .gnb_wrap .gnb > li .dp1 { padding: 0 0 1em 0; height: auto; justify-content: flex-start; align-items: center}
.allOn #header .gnb_wrap .gnb > li .dp1:after { content: "\e93e"; font-family: xeicon; margin-left: 1em; opacity: 0}
.allOn #header .gnb_wrap .gnb > li:hover .dp1 { color: var(--siteC)}
.allOn #header .gnb_wrap .gnb > li .dp1:hover:after { opacity: 1}
.allOn #header .gnb_wrap .gnb > li .dp1 .tt { font-size: 1.75em; font-weight: 500; position: relative}
.allOn #header .gnb_wrap .gnb > li .dp2 { gap: .5em 1em}
.allOn #header .gnb_wrap .gnb > li .dp2 > li > a { height: 3em; align-items: center; padding: 0 1em; border: 1px solid #ddd; border-radius: .5em; color: #555; position: relative; overflow: hidden; background: #fff}
.allOn #header .gnb_wrap .gnb > li .dp2 > li a { word-break: keep-all; line-height: 1.1}
.allOn #header .gnb_wrap .gnb > li .dp2 > li > a:after { content: "\e93f"; font-family: xeicon; position: absolute; right: .5em; top: 50%; transform: translateY(-50%); margin-right: -1em; opacity: 0; transition: .3s}
.allOn #header .gnb_wrap .gnb > li .dp2 > li > a .tt { font-size.938em; font-weight: 700}
.allOn #header .gnb_wrap .gnb > li .dp2 > li:hover > a { box-shadow: 0 0 1em rgba(0, 0, 0, .1); color: #111; border-color: var(--siteC)}
.allOn #header .gnb_wrap .gnb > li .dp2 > li:hover > a:after { margin-right: 0; opacity: 1}
.allOn #header .gnb_wrap .gnb > li .dp2 > li .dp3 { flex-direction: row; flex-wrap: wrap; gap: 0 1em; padding: .75em 0}
.allOn #header .gnb_wrap .gnb > li .dp2 > li .dp3 > li > a { color: #555; padding: .25em 1em; display: flex; gap: .25em}
.allOn #header .gnb_wrap .gnb > li .dp2 > li .dp3 > li > a:before { content: "\e91b"; font-family: xeicon; height: auto; width: auto}
.allOn #header .gnb_wrap .gnb > li .dp2 > li .dp3 > li > a .tt { font-size: .875em}
.allOn #header .gnb_wrap .gnb > li .dp2 > li .dp3 > li:hover > a { color: #111}
.allOn #header .gnb_wrap .gnb > li .dp2 > li .dp3 > li:hover > a .tt { text-decoration: underline}
.allOn #header .gnb_wrap .gnb > li .dp2 > li .dp4,
.allOn #header .gnb_wrap .gnb > li .dp2 > li .dp5 { display: none}
.allOn #header .gnb_wrap .gnb > li.m_guide { position: fixed; right: 5vmin; bottom: 2em; display: block !important}
.allOn #header .gnb_wrap .gnb > li.m_guide .dp1 { display: none}
.allOn #header .gnb_wrap .gnb > li.m_guide .dp2 { flex-direction: row; righ}
.allOn #header .gnb_wrap .gnb > li.m_guide .dp2 > li > a { border: none; padding-right: 2em; opacity: .7}
.allOn #header .gnb_wrap .gnb > li.m_guide .dp2 > li > a:after { margin-right: 0}
.allOn #header .gnb_wrap .gnb > li.m_guide .dp2 > li > a:hover { box-shadow: none; opacity: 1}
.allOn #header .top_wrap .etc_wrap { z-index: 3}
.allOn #header .top_wrap .etc_wrap .btnInc.allBtn { position: fixed; right: 3em; top: 2em; box-shadow: 0 0 1em rgba(0, 0, 0, .1); width: 4em; height: 4em; border-radius: 50%; background: #fff}
.allOn #header .top_wrap .etc_wrap .btnInc.allBtn .ico { font-size: 1.5em}
.allOn #header .all_wrap .allBtn .ico:before { content: "\e921"}
.allOn #header .top_wrap .etc_wrap .search_wrap { display: none}
.allOn #header:after { content: ""; position: absolute; right: 0; top: 0; width: 100%; height: 100%; background: #eee; z-index: 2; animation: headerAllAni 1s forwards}
.allOn #header:before { animation: headerAllAni2 1s forwards .5s; transform: translateX(100%)}
.allOn #header .top_wrap:before { width: 70vw; height: 70vw; transition: .5s; animation: headerAllAni3 20s infinite .5s alternate linear; } 
@keyframes headerAllAni { 100% { width: 0} 
 }
@keyframes headerAllAni2 { 100% { transform: translateX(0)} 
 }
@keyframes headerAllAni3 { 40% { transform: rotate(20deg) translate(-10%, 50%) scale(.8); } 
 60% { transform: rotate(40deg) translate(-10%, 50%) scale(1.2); } 
 100% { transform: rotate(0) translate(0, 0) scale(1); } 
 }

#footer { z-index: 1; color: #fff; background: #222; padding: 8vmin 0}
#footer .goTop { position: fixed; right: 0; bottom: 0; width: 3.5em; line-height: 3.5em; text-align: center; background: var(--siteC); color: #fff; box-shadow: 0 0 1em rgba(0, 0, 0, .1); opacity: 0; transform: translateY(100%); transition: .5s}
#footer .goTop .xi { font-size: 1.5em; transition: .3s}
#footer .goTop:hover .xi { transform: translateY(-.25em)}
.scroll #footer .goTop { opacity: 1; transform: translateY(0)}
#footer .wrapF { display: flex; flex-direction: column; gap: 2em}
#footer .logo_wrap { display: flex; align-items: center; gap: 4em}
#footer .logo { filter: brightness(0) invert(1)}
#footer .logo img { height: 3.7em}
#footer .menu_wrap { margin-left: auto; display: flex; gap: 3em}
#footer .menu_wrap > li > a { position: relative; font-weight: 500; opacity: .8}
#footer .menu_wrap > li:not(:first-child) > a:before { content: "·"; position: absolute; left: -1.5em; top: 0; transform: translateX(-50%); opacity: .5}
#footer .menu_wrap > li.point > a { opacity: 1; font-weight: 700}
#footer .menu_wrap > li:hover > a { text-decoration: underline}
#footer .info_wrap { display: flex; align-items: center; flex: 1; min-width: 0}
#footer .info { overflow: hidden; flex: 1 1 0%; min-width: 0}
#footer .info > li { float: left; margin-right: 2em; margin-bottom: .375em; opacity: .8; position: relative}
#footer .info > li.point { font-weight: 700}
#footer .info > li.br { clear: left}
#footer .info > li.copyright { font-size: .813em; opacity: .5; margin-top: 1em; text-transform: uppercase}
#footer .cs_wrap { display: flex; gap: 0 4em; text-align: right}
#footer .cs_wrap .wrap_in { position: relative}
#footer .cs_wrap .wrap_in:not(:first-child):after { content: ""; position: absolute; left: -2em; top: 0; width: 1px; height: 100%; background: #fff; opacity: .2}
#footer .cs_wrap .t1 { opacity: .7; font-weight: 500; margin-bottom: .5em}
#footer .cs_wrap .t2 { font-weight: 700; font-size: 1.125em}
#footer .site_wrap { margin-left: auto; background: rgba(0, 0, 0, .2); width: 16em; font-size: .938em; position: relative}
#footer .site_wrap .siteBtn { display: flex; align-items: center; padding: 1em; font-weight: 500; transition: .3s; border: 1px solid rgba(255, 255, 255, .2)}
#footer .site_wrap .siteBtn .arrow { margin-left: auto; transition: .3s}
#footer .site_wrap .list { position: absolute; left: 0; bottom: 100%; width: 100%; background: inherit; visibility: hidden; opacity: 0; transform: translateY(1em); transition: .3s; background: #111}
#footer .site_wrap .list > li > a { display: block; padding: .75em 1em; padding-right: 3em; border-bottom: 1px solid rgba(255, 255, 255, .1); position: relative; transition: .3s; opacity: .7; font-size: .938em}
#footer .site_wrap .list > li > a:after { content: "\e980"; font-family: xeicon; position: absolute; right: 1em; top: 50%; transform: translateY(-50%); opacity: 0; transition: .3s}
#footer .site_wrap .list > li > a:hover { background: rgba(255, 255, 255, .2); opacity: 1}
#footer .site_wrap .list > li > a:hover:after { opacity: 1}
#footer .site_wrap .siteBtn:hover,
#footer .site_wrap.on .siteBtn { background: rgba(0, 0, 0, .2)}
#footer .site_wrap.on .siteBtn .arrow { transform: rotate(180deg)}
#footer .site_wrap.on .list { visibility: visible; opacity: 1; transform: translateY(0)}

#contents { flex: 1 1 0%; min-height: 0; box-sizing: border-box}
#contents .sub_top_wrap { height: 50vmin; position: relative}
#contents .sub_top_wrap .wrapBg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #f1f1f1; overflow: hidden}
#contents .sub_top_wrap .wrapBg .bg { height: 100%}
#contents .sub_top_wrap .wrapBg:after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000; opacity: .3}
#contents .sub_top_wrap .wrapCon { display: flex; height: 100%; flex-direction: column; position: relative; padding-top: var(--headerH); box-sizing: border-box}
#contents .sub_top_wrap .wrapF { } 
#contents .sub_top_wrap .subTit { flex: 1; min-height: 0; justify-content: center; display: flex; align-items: center; justify-content: center; text-align: center}
#contents .sub_top_wrap .subTit .wrapF { height: 100%; display: flex; flex-direction: column; justify-content: center; color: #fff; line-height: 1; gap: 1em}
#contents .sub_top_wrap .subTit .t1 { font-size: 3em; font-weight: 700}
#contents .sub_top_wrap .subTab { position: relative}
#contents .sub_top_wrap .subTab .gnb > li.on { display: flex !important; width: 100%; justify-content: center}
#contents .sub_top_wrap .subTab .gnb > li > .dp2 { display: inline-flex; justify-content: center; flex-wrap: wrap; border-radius: 1em 1em 0 0; overflow: hidden}
#contents .sub_top_wrap .subTab .gnb > li > .dp2 > li { position: relative; flex: 1; min-width: 0; width: 22vmin; max-width: 22vmin}
#contents .sub_top_wrap .subTab .gnb > li > .dp2 > li > a { height: 4em; display: flex; align-items: center; justify-content: center; color: #fff; box-sizing: border-box; background: rgba(0, 0, 0, .5); position: relative}
#contents .sub_top_wrap .subTab .gnb > li > .dp2 > li > a:before { content: ""; position: absolute; left: -1px; top: 50%; height: 30%; transform: translateY(-50%); background: #fff; width: 1px; opacity: .2}
#contents .sub_top_wrap .subTab .gnb > li > .dp2 > li > a .va { display: flex; align-items: center; line-height: 1.1; position: relative; transition: .3s; word-break: keep-all; text-align: center}
#contents .sub_top_wrap .subTab .gnb > li > .dp2 > li > a .va .tt { font-size: 1.05em; font-weight: 700}
#contents .sub_top_wrap .subTab .gnb > li > .dp2 > li > a .va .arrow { position: absolute; right: 0; top: 50%; transform: translateY(-50%); overflow: hidden; font-size: 0; transition: .3s}
#contents .sub_top_wrap .subTab .gnb > li > .dp2 > li > a .va .arrow:before { content: "\e942"}
#contents .sub_top_wrap .subTab .gnb > li > .dp2 > li.on > a { background: #f5f5f5; color: #111}
#contents .sub_top_wrap .subTab .gnb > li > .dp2 > li.on > a .va,
#contents .sub_top_wrap .subTab .gnb > li > .dp2 > li:hover > a .va { opacity: 1; transform: translateX(0); padding-right: 1.5em}
#contents .sub_top_wrap .subTab .gnb > li > .dp2 > li.on > a .va .arrow,
#contents .sub_top_wrap .subTab .gnb > li > .dp2 > li:hover > a .va .arrow { font-size: 1.25em}

#contents .sub_tit_wrap { padding: 3vmin 0; border-bottom: 1px solid #eee; background: #f5f5f5}
#contents .sub_tit_wrap .wrapF { display: flex; display: flex; gap: 2vmin; align-items: center}
#contents .sub_tit_wrap .titW { flex: 1; min-width: 0}
#contents .sub_tit_wrap .titW .t1 { font-weight: 500; font-size: 2.25em}
/* #contents .sub_tit_wrap .titW .t1 { font-weight:500; font-size:2.625em } */
#contents .sub_tit_wrap .nav { display: flex; align-items: center}
#contents .sub_tit_wrap .nav { display: inline-flex; align-items: center; gap: 0 1em}
#contents .sub_tit_wrap .nav > li:not(.home):before { content: "\e940"; font-family: xeicon; margin-right: .5em; font-size: .938em}
#contents .sub_tit_wrap .nav > li.home > a { width: 1.5em; height: 1.5em; border-radius: 50%; background: var(--siteC); color: #fff; display: flex; align-items: center; justify-content: center}
#contents .sub_tit_wrap .nav > li.home > a .xi { font-size: .875em}

#contents .sub_top_wrap .wrapBg .bg { background-position: center 60%; transition: 3s}
#contents .sub_top_wrap.on .wrapBg .bg { background-position: center 100%}

#contents .doc { padding: 6vmin 0 16vmin 0}

.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}

.sns_st { display: flex; gap: .5em}
.sns_st > li > a { display: flex; align-items: center; justify-content: center; width: 2.5em; height: 2.5em; border-radius: 50%; transition: .3s}
.sns_st > li > a .xi { font-size: 1.5em}
.sns_st > li > a img { height: 1.125em}
.sns_st > li > a:hover { background: #111; color: #fff}
.sns_st > li > a:hover img { filter: brightness(0) invert(1)}
.sns_st > li > a.kc img { height: 1.438em}

.d1 #contents { background: #f5f5f5}
.d1 #contents .doc { padding-top: calc(var(--headerH) + 6vmin)}

/**/
.layer_inp { display: block; position: relative}
.layer_inp .inp { border: 1px solid #ddd; margin-bottom: -1px; padding: 1em; padding-left: 4em; height: 4em; box-sizing: border-box; width: 100%; position: relative; font-weight: 500; font-size: 1.188em}
.layer_inp select.inp { padding-left: 3.75em}
.layer_inp select.inp optgroup,
.layer_inp select.inp option { font-weight: 400; font-size: .938em}
.layer_inp:first-child .inp { border-top-left-radius: .5em; border-top-right-radius: .5em}
.layer_inp:last-child .inp { border-bottom-left-radius: .5em; border-bottom-right-radius: .5em}
.layer_inp .tt { position: absolute; left: 4em; top: 0; width: calc(100% - 4em); height: 100%; display: flex; align-items: center; box-sizing: border-box; padding: 0 .5em; z-index: 2; color: #777; font-weight: 500; cursor: text}
.layer_inp .tt > i { font-size: 1.063em}
.layer_inp .ico { font-size: 1em; position: absolute; left: 0; top: 0; width: 4.5em; height: 100%; display: flex; align-items: center; justify-content: center; z-index: 2}
.layer_inp .ico:before { font-size: 1.5em}
.layer_inp .inp:valid,
.layer_inp .inp:focus { border-color: var(--siteC); outline: none; z-index: 1}
.layer_inp .inp:valid ~ .tt,
.layer_inp .inp:focus ~ .tt { width: auto; height: 1em; transform: translateY(-50%); background: #fff; color: var(--siteC)}
.layer_inp .inp:valid ~ .tt > i,
.layer_inp .inp:focus ~ .tt > i { font-size: .875em}
.login_wrap { width: 40em; max-width: 100%; margin: 0 auto; display: flex; flex-direction: column; gap: 2em}
.login_wrap.w1 { width: 50em}
.login_wrap.w2 { width: 100%}
.login_wrap .login_tit { display: flex; justify-content: center; text-align: center; flex-direction: column; align-items: center; gap: 1em; padding: 2em 0 0 0; text-transform: uppercase}
.login_wrap .login_tit .t1 { font-weight: 700; font-size: 2.5em; color: #333}
.login_wrap .login_tit .t1.s1 { font-size: 2.25em}
.login_wrap .login_tit .t2 { font-weight: 500; color: #777; font-size: 1.063em}
.login_wrap .login_tit.flexR { flex-direction: row; justify-content: space-between; padding: 2em 0 0 1em}
.login_wrap .login { padding: 3em; padding-top: 2.5em; border-radius: 1em; box-shadow: 0 0 2em rgba(0, 0, 0, .1); background: #fff; display: flex; flex-direction: column; gap: 1em 0}
.login_wrap .login.row { flex-direction: row; gap: 5em}
.login_wrap .login.row > * { flex: 1}
.login_wrap .login.g1 { gap: .5em 0}
.login_wrap .login > * { width: 100%; box-sizing: border-box}
.login_wrap .btn { height: 3.5em; border-radius: .5em; border: 2px solid transparent; font-weight: 700; font-size: 1.313em; display: flex; align-items: center; justify-content: center; gap: .25em}
.login_wrap .btn.s1 { font-size: 1.125em}
.login_wrap .btn .xi { font-size: 1.125em}
.login_wrap .btn.c1 { background: var(--siteC); color: #fff}
.login_wrap .btn.c2 { background: #333; color: #fff}
.login_wrap .btn.c2.re { border-color: #333; color: #333; background: #fff}
.login_wrap .link_wrap { padding: .5em; gap: 0 1.5em; display: flex; align-items: center; justify-content: center}
.login_wrap .link_wrap a { font-weight: 500; color: #777; position: relative; display: flex; align-items: center; gap: .25em}
.login_wrap .link_wrap a:after { content: "\e93f"; font-family: xeicon}
.login_wrap .link_wrap a.point { font-size: 1.063em; font-weight: 700; color: #111}
.login_wrap .link_wrap a:hover:before { content: ""; position: absolute; left: 0; top: 100%; width: calc(100% - 1em); height: 1px; background: #aaa}
.login_wrap .link_wrap a.point:hover:before { background: #111}
.login_wrap .m0 { margin-top: -.5em}
.login_wrap .m1 { margin-top: 1em}
.login_wrap .tt1 { font-weight: 700}
.login_tab { display: flex; justify-content: center; gap: 2vmin}
.login_tab > li { width: 45vmin; max-width: calc(50% - 1vmin)}
.login_tab > li > div { height: 100%; border-radius: 1em}
.login_tab > li .wrap_in { height: 100%; box-sizing: border-box; padding: 2em; background-color: #fff; box-shadow: 0 0 1em rgba(0, 0, 0, .2); border-radius: 1em; display: flex; flex-direction: column; gap: 2em}
.login_tab > li .wrap_in .icoW { width: 50%; margin: 0 auto}
.login_tab > li .wrap_in .icoW .resize { padding-bottom: 100%; border-radius: 50%; background: #f1f1f1}
.login_tab > li .wrap_in .icoW .resize .re { display: flex; align-items: center; justify-content: center}
.login_tab > li .wrap_in .icoW .resize .xi { font-size: 5em; opacity: .2}
.login_tab > li .wrap_in .imgW { width: 80%; margin: 0 auto; position: relative}
.login_tab > li .wrap_in .imgW:before { content: ""; position: absolute; left: 50%; top: 50%; width: 80%; padding-bottom: 80%; border-radius: 50%; background: #f1f1f1; transform: translate(-50%, -50%)}
.login_tab > li .wrap_in .imgW .resize { padding-bottom: 75%}
.login_tab > li .wrap_in .conW { display: flex; flex-direction: column; gap: 1em; text-align: center}
.login_tab > li .wrap_in .conW .t1 { font-weight: 800; font-size: 1.25em}
.login_tab > li .wrap_in .conW .t2 { font-weight: 700; color: #666; line-height: 1.5; word-break: keep-all}
.login_tab > li .wrap_in .btnW { display: flex; margin-top: auto}
.login_tab > li .wrap_in .btnW .st { flex: 1; display: flex; gap: .5em; align-items: center; justify-content: center; height: 4em; border-radius: .5em; background: #f5f5f5}
.login_tab > li .wrap_in .btnW .st:after { content: "\e93e"; font-family: xeicon; position: absolute; opacity: 0; transform: translateX(100%)}
.login_tab > li .wrap_in:hover .btnW .st { background-image: var(--siteGra); color: #fff}
.login_tab > li .wrap_in:hover .btnW .st:after { opacity: 1; transform: translateX(0); position: inherit; transition: transform .3s}
.login_tab > li .wrap_in .btnW .st.c1 { background: #ddd}
.login_tab > li .wrap_in:hover .btnW .st.c1 { background: #111}
.login_tab > li .wrap_in .btnW .st .t1 { font-weight: 800; font-size: 1.063em}

.agree_box { border-radius: .5em; border: 1px solid #ddd; padding: 1.5em; color: #666; font-size: .938em; line-height: 1.4}
.agree_box.st1 { border-radius: 1em; padding: 3em; font-size: 1em; line-height: 1.5}
.agree_box.h1 { height: 8em; overflow-y: auto; } 
.agree_box strong { color: #111; font-weight: 700}

.step_st { display: flex; flex-direction: row-reverse; justify-content: center}
.step_st > li { width: 7em}
.step_st > li .wrap_in { display: flex; flex-direction: column; align-items: center; gap: 1em}
.step_st > li .wrap_in .ico { position: relative; width: 2em; height: 2em}
.step_st > li .wrap_in .ico .no { position: relative; box-sizing: border-box; width: 100%; height: 100%; border-radius: 50%; background: #fff; border: 1px solid #DDD; color: #AAA; display: flex; align-items: center; justify-content: center; font-weight: 900; font-size: .813em}
.step_st > li .wrap_in .ico .xi { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; border-radius: 50%; } 
.step_st > li:not(:last-child) .wrap_in .ico:before { content: ""; position: absolute; right: 50%; top: 50%; transform: translateY(-50%); width: 7em; height: .25em; background: #ddd}
.step_st > li .wrap_in .tt { color: #777; font-size: .875em; font-weight: 700}
.step_st > li.on ~ li .wrap_in .ico:before,
.step_st > li.on .wrap_in .ico:before { background: var(--siteC)}
.step_st > li.on ~ li .wrap_in .ico .xi,
.step_st > li.on .wrap_in .ico .xi { z-index: 1; background: var(--siteC); color: #fff; border: 2px solid var(--siteC)}
.step_st > li.on ~ li .wrap_in .ico .xi:before,
.step_st > li.on .wrap_in .ico .xi:before { content: "\e928"}
.step_st > li.on ~ li .wrap_in .tt,
.step_st > li.on .wrap_in .tt { color: #111; font-weight: 700}
.step_st > li.on .wrap_in .ico .xi { background: #fff; color: var(--siteC)}
.step_st > li.on .wrap_in .ico .xi:before { animation-name: blinkTextAni; animation-duration: 2s; animation-iteration-count: infinite; animation-timing-function: step-end}

.fin_box { border-radius: .5em; border: 1px solid transparent; padding: 3em; background: #f5f5f5; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 1.5em}
.fin_box.al { align-items: flex-start; text-align: left}
.fin_box.p1 { padding: 2em; gap: .75em}
.fin_box.bg1 { background: none; box-shadow: 0 0 1em rgba(0, 0, 0, .1)}
.fin_box .tit { font-size: 1.5em; font-weight: 500; color: #111; text-align: center}
.fin_box .tt1 { line-height: 1.5; font-size: 1.063em; color: #666; font-weight: 500}
.fin_box .tt1.s1 { font-size: 1em}
.fin_box .fs:not(:last-child):after { content: ","}
.fin_box .fin_ico { font-size: 4em; opacity: .1; margin-bottom: .25em}
.fin_box .tit,
.fin_box .tit > i,
.fin_box .tt { word-break: keep-all}

.memoSt { border-radius: 1em; padding: .75em 1.5em; position: relative}
.memoSt.p1 { padding: 1.5em 2em}
.memoSt:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #f5f5f5; border-radius: inherit; box-sizing: border-box}
.memoSt > li { font-size: .938em; margin: .75em 0; color: #666; position: relative}
.memoSt > li.ico { padding-left: 1em}
.memoSt > li.ico:before { content: "●"; position: absolute; left: 0; top: 0; transform: scale(.4); transform-origin: 0% 50%; color: #111}
.memoSt > li.tit { font-weight: 700; font-size: 1.063em; color: #111}
.memoSt > li.tit:not(:first-child) { margin-top: 1em}
.memoSt > li strong { font-weight: 700}
.memoSt.bg1:before { background: #fff; opacity: 1; border: 1px solid #ddd}
.memoSt.bg1 > li.ico:before { color: #aaa}
.memoSt.bg2:before { background: #999}
.memoSt.bg2 > li.ico:before { color: #333}

/**/
.br1 { border-radius: 1em; overflow: hidden}
.br2 { border-radius: 2em; overflow: hidden}
.outRound { position: relative}
.outRound:before,
.outRound:after { content: ""; position: absolute; width: 1em; height: 1em; z-index: 1; background: url(../images/inc/round.svg) no-repeat; background-size: 100% 100%}
.outRound.rb { border-top-left-radius: 1em}
.outRound.rb:before { right: 0; bottom: 100%}
.outRound.rb:after { right: 100%; bottom: 0}
.outRound.lb { border-top-right-radius: 1em}
.outRound.lb:before { left: 0; bottom: 100%; transform: rotate(90deg)}
.outRound.lb:after { left: 100%; bottom: 0; transform: rotate(90deg)}

.mainBox { padding: 8vmin 0 10vmin 0; overflow: hidden; position: relative}
.mainBox.bg1 { background: #f5f5f5}
.mainBox .wrapBg { position: absolute; left: 0; top: 0; width: 100%; height: 100%}
.mainBox .wrapBg:after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000; opacity: .2}
.mainBox .wrapF { display: flex; flex-direction: column; gap: 5vmin; position: relative}
.mainBox .wrapF.dRow { flex-direction: row}
.mainBox .wrapF.dRow .wrap_con { flex: 1; min-width: 0}
.mainBox .wrapF.g1 { gap: 8vmin}
.mainBox .wrapCon { position: relative}
.mainBox.p0 { padding: 0}

.mainTit { display: flex; align-items: center; gap: 1.5em}
.mainTit.s1 { font-size: 1.2vmin}
.mainTit.hc { justify-content: center; text-align: center}
.mainTit.vt { align-items: flex-start}
.mainTit.col { flex-direction: column}
.mainTit.col.hc { align-items: center}
.mainTit .arrow { font-size: 1em; margin-left: .5em}
.mainTit .arrow:before { content: "\e93f"}
.mainTit .titW { display: flex; align-items: center; gap: .25em}
.mainTit .tit1 { font-size: 5vmin; font-weight: 700; letter-spacing: -.05em; word-spacing: .1em; line-height: 1.1}
.mainTit .tit1.s1 { font-size: 4.5vmin}
.mainTit .tit1.s2 { font-size: 2.5vmin}
.mainTit .tit2 { font-size: 4vmin; font-weight: 500}
.mainTit .tt1 { filter: opacity(.6); font-weight: 500; font-size: 1.25em}
.mainTit .mgL { margin-left: auto}
.mainTit.white { color: #fff}

.main_more { display: inline-flex; align-items: center; padding: 0 1.5em; height: 3em; border: 1px solid var(--siteC); color: var(--siteC); gap: .5em; border-radius: 3em; margin-top: 2em; transition: .3s}
.main_more .tt { font-weight: 700}
.main_more .arrow { font-size: 1em; margin-left: 1em; transition: .3s}
.main_more .arrow:before { content: "\e907"}
.main_more.white { border-color: #fff; color: #fff}
.main_more:hover { border-color: transparent; background: var(--siteC); color: #fff}
.main_more:hover .arrow { transform: translateX(50%)}

.vod_wrap { position: relative}
.vod_wrap .vod { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover}
.vod_wrap .layer { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000; opacity: .1}
.vod_wrap .layer.gra { background: linear-gradient(0deg, rgba(0, 0, 0, .3) 0%, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, .3) 100%); } 

.visualSlide .swiper-slide.el { position: relative; overflow: hidden; height: 85vmin; background: #fff}
.visualSlide .el .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: scale(1.2)}
.visualSlide .el .vod_wrap { position: relative; height: 100%}
.visualSlide .el .vod_wrap:after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000}
.visualSlide .el.swiper-slide-active .vod_wrap:after,
.visualSlide .el.swiper-slide-duplicate-active .vod_wrap:after { transition: 2s; opacity: .2}
.visualSlide .el.swiper-slide-active .bg,
.visualSlide .el.swiper-slide-duplicate-active .bg { transition: 7s; transform: scale(1) rotate(.001deg)}
.visualSlide .el[data-swiper-slide-index='3'] .bg { width: 110%; transform: scale(1)}
.visualSlide .el.swiper-slide-active[data-swiper-slide-index='3'] .bg,
.visualSlide .el.swiper-slide-duplicate-active[data-swiper-slide-index='3'] .bg { transform: translateX(-9.0909%) rotate(.001deg)}
.visualSlide .el[data-swiper-slide-index='1'] .bg { width: 110%; transform: scale(1); left: auto; right: 0}
.visualSlide .el.swiper-slide-active[data-swiper-slide-index='1'] .bg,
.visualSlide .el.swiper-slide-duplicate-active[data-swiper-slide-index='1'] .bg { transform: translateX(9.0909%) rotate(.001deg)}

.visualSlide_wrap { --mainVisualConH: 10vmin; position: relative}
.visualSlide_wrap .slogan { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding-top: var(--headerHS); padding-bottom: calc(var(--mainVisualConH) * 2.5); box-sizing: border-box; filter: brightness(0) invert(1); display: flex; align-items: center}
.visualSlide_wrap .slogan .wrapF { display: flex; flex-direction: column; justify-content: center; text-align: center}
.visualSlide_wrap .slogan .img img { height: 5vmin}
.visualSlide_wrap .slogan .t1 { font-size: 3.25em; font-weight: 800; letter-spacing: -.05em; word-spacing: .1em; text-transform: uppercase; line-height: 1; margin: 0 0 5vmin 0}
.visualSlide_wrap .slogan .t2 { font-size: 1.625em; font-weight: 500}
.visualSlide_wrap .gsClassSlide.tShow .el { overflow: hidden}
.visualSlide_wrap .gsClassSlide.tShow .el > i { transform: translateY(20vh); transition: 1s}
.visualSlide_wrap .gsClassSlide.tShow.on .el > i { transform: translateY(0)}
.visualSlide_wrap .gsClassSlide.tShow.on.t2 .el:nth-child(1) > i { transition-delay: .5s}
.visualSlide_wrap .gsClassSlide.tShow.on.t2 .el:nth-child(2) > i { transition-delay: 1s}

.visualSlide_control { position: relative; z-index: 10; margin-top: calc(var(--mainVisualConH) * 2 * -1); margin-bottom: 1em}
.visualSlide_control .paging .swiper-pagination-progressbar-fill { transition-duration: 3s !important}
.visualSlide_control .control { width: 100%; gap: 1em}
.visualSlide_control .paging { width: 5em; text-align: center; } 
.visualSlide_control .paging .swiper-pagination-current { font-weight: 700}

.mainScroll { width: 15vmin; position: relative}
.mainScroll .svgtt { width: 100%; height: 100%}
.mainScroll .svgtt .tt { font-weight: 700; text-transform: uppercase; letter-spacing: .188em; font-size: 1.25em; fill: #fff}
.mainScroll .in { position: absolute; left: 10%; top: 10%; width: 80%; height: 80%; border-radius: 50%; display: flex; align-items: center; justify-content: center; text-align: center; box-sizing: border-box}
.mainScroll .in .ico1 { font-size: 2em; margin-right: -.25em}

.mainNews { border-radius: 8vmin; box-shadow: 0 6vmin 6vmin rgba(0, 0, 0, .1); z-index: 10}
.mainNews .wrapCon { display: flex; gap: 8vmin}
.mainNews .wrapCon .inW { display: flex; flex-direction: column}
.mainNews .wrapCon .inW .swiper-container,
.mainNews .wrapCon .inW .swiperControl { width: 100%; box-sizing: border-box}
.newsSlideW { flex: 1; min-width: 0; flex: 1}
.newsSlideW .el { width: 33.33%; height: auto; direction: ltr; } 
.newsSlide { margin: -1vmin}
.mainNewsSt { padding: 4vmin; margin: 1vmin; border: 1px solid rgba(0, 0, 0, .1); box-sizing: border-box; height: calc(100% - 2vmin); display: flex; flex-direction: column; background: #fff}
.mainNewsSt .conW { display: flex; flex-direction: column; align-items: flex-start; gap: 1em; flex: 1; min-height: 0}
.mainNews .tCate { height: 2em; background: #000; color: #fff; border-radius: 1em; display: inline-flex; align-items: center; padding: 0 1em; gap: .5em; font-weight: 700; font-size: .938em; white-space: nowrap}
.mainNews .tCate.c1 { background: #099}
.mainNews .tCate.c2 { background: #69F}
.mainNews .tCate.c3 { background: #F33}
.mainNews .tDate { font-size: .875em; color: #999}
.mainNews .tTit { font-size: 1.25em; font-weight: 700}
.mainNews .tText { color: #666; font-size: .938em; word-break: break-all}
.mainNewsSt:hover { border-color: var(--siteC); box-shadow: 0 0 1em rgba(0, 0, 0, .1)}
.mainNews .swiperControl { padding: 1em .5em; margin-top: auto}
.photoSlideW { width: 50vmin; position: relative}
.photoSlideW .photoSlide { border-radius: 1em; box-shadow: 0 0 1em rgba(0, 0, 0, .1)}
.mainPhotoSt .resize { padding-bottom: 66.66%}
.photoSlideW .tCate { position: absolute; right: 0; top: 0; border-top-left-radius: 0; border-bottom-right-radius: 0; z-index: 10; height: 3em}

.mainWork { --mainWorkMove: 8vmin; } 
.mainWork .list { display: flex; align-items: flex-start; gap: 1px; padding-bottom: var(--mainWorkMove)}
.mainWork .list > li { flex: 1; position: relative}
.mainWork .list > li .bg { height: 50vh; overflow: hidden; position: relative}
.mainWork .list > li .bg:after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000; opacity: .3}
.mainWork .list > li:nth-child(odd) { transform: translateY(var(--mainWorkMove))}
.mainWork .list > li:first-child .bg { border-top-left-radius: 10vh}
.mainWork .list > li:last-child .bg { border-bottom-right-radius: 10vh}
.mainWork .list > li .con { position: absolute; left: 0; top: 0; width: 100%; height: 100%; box-sizing: border-box; padding: 10%; display: flex; flex-direction: column; gap: 1em; justify-content: flex-end; align-items: flex-start; color: #fff}
.mainWork .list > li .con .t1 { font-size: 2em; font-weight: 700}
.mainWork .list > li .con .t2 { font-size: 1.063em; line-height: 1.5}
.mainWork .list.on > li { transition: 2s}
.mainWork .list.on > li:nth-child(odd) { transform: translateY(0)}
.mainWork .list.on > li:nth-child(even) { transform: translateY(var(--mainWorkMove))}

.mainAttorney .wrapBg:after { opacity: .4}
.mainAttorney .list { display: flex; justify-content: center; position: relative; overflow: hidden; color: #fff}
.mainAttorney .list > li { flex: 1; position: relative}
.mainAttorney .list > li .st { display: flex; text-align: center; justify-content: center; flex-direction: column; gap: .5em; box-sizing: border-box; width: 100%; height: 100%; padding: 2em 1em; border: 1px solid transparent; transition: .3s}
.mainAttorney .list > li .st:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 97%; background: rgba(0, 0, 0, .5); border-radius: 1em; opacity: 0}
/* .mainAttorney .list > li .st:before { content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.5); border-radius:1em; opacity:0 } */
.mainAttorney .list > li .st:after { content: ""; position: absolute; left: -1px; top: -1px; width: 100%; height: 100%; border: 1px solid rgba(255, 255, 255, .1); border-right: none; border-bottom: none; border-top: none; } 
.mainAttorney .list > li .st > * { position: relative}
.mainAttorney .list > li .st .ico { height: 5em; display: flex; align-items: center; justify-content: center; margin: 1em 0}
.mainAttorney .list > li .st .ico img { height: 70%; display: flex; filter: brightness(0) invert(1)}
.mainAttorney .list > li .st .t1 { font-size: 1.25em; font-weight: 700; display: flex; justify-content: center; gap: 1em}
.mainAttorney .list > li .st .arrow { font-size: 1.5em; opacity: 0}
.mainAttorney .list > li .st .arrow:before { content: "\e916"}
.mainAttorney .list > li:hover .st:before { opacity: 1; transition: .3s; border: 3px solid rgba(164, 0, 0, .5); } 
.mainAttorney .list > li:hover + li .st:after,
.mainAttorney .list > li:hover .st:after { opacity: 0}
.mainAttorney .list > li:hover .st .arrow { transform: rotate(180deg); opacity: 1; transition: .5s}

.mainPartnerSlide { margin-bottom: 2em}
.mainPartnerSlide .swiper-wrapper { transition-timing-function: linear}
.mainPartnerSlide .el { width: 14.28%}
.mainPartnerSlide .el .img_wrap { padding: 1em}
.mainPartnerSlide .el .img_wrap .resize { padding-bottom: 30%}
.mainPartnerSlide .el .img_wrap .resize img { max-height: 70%; max-width: 70%}

/* .mainLink .list { display:flex; gap:2EM } 
.mainLink .list .el { flex:1; min-width:0 } 
.mainLink .list .el .in { background:#fff; height:6em; border-radius:1em; box-sizing:border-box; display:flex; align-items:center; justify-content:center; gap:1em } 
.mainLink .list .el .in:hover .mainTit .arrow { transition:.3s } 
.mainLink .list .el .in .icoW { width:3.5em; height:3.5em; display:flex; align-items:center; justify-content:center; background: radial-gradient(circle, #fff 40%, #ddd 100%); border-radius:50% } 
.mainLink .list .el .in .icoW .xi { font-size:1.5em } 
.mainLink .list .el .in .t1 { font-weight:700; font-size:1.188em } 
.mainLink .list .el .in .arrow { font-size:0 } 
.mainLink .list .el .in .arrow:before { content:"\e93f" } 
.mainLink .list .el .in:hover .icoW { background:var(--siteC); color:#fff } 
.mainLink .list .el .in:hover .arrow { font-size:1em; transition:.3s } */

/*메인 링크*/
.main_link { position: relative; overflow: hidden; } 
.onSlider > li { width: 50%; cursor: pointer; } 
.onSlider > li .bg { opacity: 0; transition: .3s}
.onSlider > li .con { position: relative; z-index: 2; justify-content: center; border-right: 1px solid rgba(255, 255, 255, .2); color: #fff; background: rgba(0, 0, 0, .5); height: 20rem; text-align: center; transition: .3s; } 
.onSlider > li .con .tit { font-weight: 700; font-size: 1.875em; margin-bottom: .75em; margin-top: 3em; opacity: .75; transition: .5s; } 
.onSlider > li .con .txt { font-size: 1.1em; font-weight: 500; line-height: 1.5; margin-bottom: 1em; opacity: 0; transition: .5s; transform: translateY(30px); } 
.onSlider > li .con .xi { opacity: 0; transition: .5s; transform: translateY(30px); } 
.onSlider > li .con .btnW { margin-top: 1em; opacity: 0; transition: .5s; gap: 1em; } 
.onSlider > li .con .list { color: #fff; width: auto; padding-right: 1em; } 
.onSlider > li .con .list > li > span { font-weight: 700; opacity: 1; } 
.onSlider > li .con .btnW a { border: 1px solid #fff; padding: .5em 1em; width: 1em; box-sizing: border-box; display: inline-block; border-radius: 1em; transition: .5s; } 

.onSlider > li:hover .bg { opacity: 1}
.onSlider > li.on .bg { opacity: 1}

.onSlider > li:hover .con .tit { margin-top: 1em; opacity: 1; } 

.onSlider > li:hover .con .xi,
.onSlider > li:hover .con .btnW,
.onSlider > li:hover .con .txt { transform: translateY(0); opacity: 1; } 
.onSlider > li .con .btnW a:hover { background-color: rgba(164, 0, 0, .5); } 
.section3 { } 
.section3 .txtCon { padding: 2em 0; } 
.section3 .txtCon .tit { font-size: 3em; font-weight: 800; } 
.section3 .txtCon .txt { font-size: 1.68em; font-weight: 600; color: #fff; opacity: .85; margin-top: .8em; } 
.section3 .txtCon .btnW { font-size: 1.25em; } 

.section3 .txtCon .btnW .linkB { border: 2px solid #fff; padding: .4em 1em; border-radius: 3em; opacity: .8; transition: all .3s; color: #fff; } 
.section3 .txtCon .btnW:hover .linkB { opacity: 1; transform: scale(1.01); font-weight: 800; } 
.section3 .txtCon .btnW .linkB .xi { transition: all .3s; } 
.section3 .txtCon .btnW:hover .linkB .xi { transform: translateX(13px); } 
/* sub */

/* 공통 */
.page_con { padding: 4em 0; } 
.page_con.conP3 { padding: 3em 0; } 
.page_con.conP2 { padding: 2em 0; } 
.page_con.conP6 { padding: 6em 0; } 
.page_con.pt0 { padding-top: 0 !important; } 
.page_con.bg1 { background: var(--siteBg1); } 
.page_con.bg2 { background: var(--siteBg2); } 
.page_con.bg3 { background: var(--siteBg3); } 
.doc.pd0 .page_con:last-child,
.doc.pb0 .page_con:last-child { padding-bottom: 10em; } 

.sub_tit { margin-bottom: 1em; } 

.page_tt { font-size: 1em; word-break: keep-all; line-height: 1.6; } 
.page_tt > .tt + .tt { margin-top: 1.25em; } 
.page_tt.o1 { opacity: .7; } 
.page_tt.o2 { opacity: .1; } 
.page_tt.s1 { font-size: 0.938em}
.page_tt.s2 { font-size: 1.063em}
.page_tt.s3 { font-size: 1.125em}
.page_tt.s4 { font-size: 1.250em}
.page_tt.s5 { font-size: 1.313em}
.page_tt.s6 { font-size: 1.500em}
.page_tt.s7 { font-size: 1.625em}
.page_tt.s8 { font-size: 1.875em}
.page_tt.s9 { font-size: 2.375em}
.page_tt.s10 { font-size: 2.750em}
.page_tt.s11 { font-size: 3.250em}
.page_tt.s12 { font-size: 4.000em; } 
.page_tt.s13 { font-size: 4.500em; } 
.page_tt.s14 { font-size: 5.250em; } 

/**/
.bg_wrap { height: 22em; } 
.bg_wrap .imgCon { height: 100%; position: relative; } 
/* .bg_wrap .imgCon::before { position: absolute; content: ''; bottom: -3.8em; left: 50%; transform: translateX(-50%); width: 100%; height: 95%; background: #f2f2f2; border-radius: 1em; z-index: -1; } */
.bg_wrap .imgCon img { margin: 0 auto; display: block; height: 100%; object-fit: cover; width: 90%; border-radius: 1em; box-shadow: 0px 20px 30px rgba(17, 17, 17, 0.3); } 

.imgCon { width: 100%; } 
.imgCon.bg1 { background: #f7f7f7; } 
.num { display: inline-flex; justify-content: center; font-size: .85em; align-items: center; width: 1em; height: 1em; border-radius: 50%; border: 2px solid #444; color: #444; font-weight: 700; flex: 0 0 auto; min-width: 0; margin-right: .5em; } 
.num2 { display: inline-flex; justify-content: center; font-size: .985em; align-items: center; width: 1.25em; height: 1.25em; border-radius: 50%; background-color: var(--siteC); color: #fff; font-weight: 700; flex: 0 0 auto; min-width: 0; margin-right: .5em; } 
/**/
.introWrap { background: #f2f2f2; margin-top: -7em; padding: 11em 3em 3em; border-radius: 11em 4em 2em 2em; } 
.pageIn { padding: 4em; margin-top: 2em; background: #fff; border-radius: 1em; } 
.pageIn .sub_txt { position: relative; margin-top: 4.3em; } 
.pageIn .sub_txt::before { position: absolute; content: ''; left: 50%; top: -4.3em; background: url(../images/sub/dott_img01.png) no-repeat; width: 2.6em; height: 2.4em; background-size: 95%; transform: translateX(-50%); /* opacity: .25; */}
.pageIn .sub_txt .t2 { font-size: 1.13em; line-height: 1.95; } 
.pageIn .sub_txt .t2 .tt2 { font-size: .958em; line-height: 1.7; color: #444; padding-left: 10px; } 

/* 테이블 스크롤 */
.scr_i { display: none; } 

/* member */
.memBannerSlider_wrap { padding: 1em 0em; border-top: 1px solid #ddd; background: #f7fafd; background: #f7fafd; } 
.memBannerSlider_wrap .inner { gap: 1em 2em; } 
.memBannerSlider_wrap .tit_wrap { gap: 0 2em; } 
.memBannerSlider_wrap .tit_wrap .tit { gap: 1em; } 
.memBannerSlider_wrap .tit_wrap .tit .tt { font-size: 1.125em; font-weight: 700; color: #000; } 
.memBannerSlider_wrap .tit_wrap .tit .xi { font-size: 1.500em; color: var(--siteC); transition: .2s; } 
.memBannerSlider_wrap .tit_wrap .tit:hover { color: var(--siteC); } 
.memBannerSlider_wrap .tit_wrap .tit:hover .xi { transform: rotate(180deg); } 
.memBannerSlider { flex: 1; padding-right: 4px; } 
/* .memBannerSlider .el .in { height: 4.65em; overflow: hidden; } */
.memBannerSlider .el { } 
.memBannerSlider .el .in { height: 3.25em; padding: 0 1em; overflow: hidden; } 
.memBannerSlider .el .in .tt { font-weight: 700; color: #777; text-align: center; } 
.memBannerSlider .el img { border: 1px solid #ddd; } 

/* company-ceo 인사말 */
.greet_wrap { } 
.greet_wrap .greet-top { border-bottom: 1px dotted #777; padding-bottom: .5em; line-height: 1.7; position: relative; } 
.greet_wrap .greet-top::before { content: ""; position: absolute; bottom: -0.1em; left: 0; width: 22%; height: 1.2px; background-color: var(--siteC)}
.greet_wrap .greet-top .t2 { margin-top: 10px; line-height: 1.2; } 
.greet_wrap .greet-con { gap: 5em; align-items: center; /* padding: 0 3em; */}
.greet_wrap .greet-con .img_wrap { width: 40%; } 
.greet_wrap .greet-con .img_wrap .img { width: 100%; padding-bottom: 140%; background-color: #f2f2f2; border-radius: 1em; } 
/* .greet_wrap .greet-con .img_wrap .img { width: 100%; margin-top: -4em; padding-bottom: 120%; border:1px solid #ddd; border-radius: 1em; box-shadow: -3px 3px 15px rgba(0,0,0,.1); } */
.greet_wrap .greet-con .txt_wrap { order: -1; flex: 1; padding-top: 1em; } 
.greet_wrap .greet-con .txt_wrap .page_tt { color: #333; } 
.greet_wrap .greet-con .txt_wrap .page_tt + .page_tt { margin-top: 1em; } 
.greet_wrap .greet-con .txt_wrap p.ceo { margin-top: 1em; padding-right: 3em; font-size: 1.25em; text-align: right; } 
.greet_wrap .greet-con .txt_wrap p.ceo strong { padding-left: 1em; font-weight: 600; font-size: 1.5rem; } 

/* 조직도 */
/* .organ_img { background: #f7f7f7; border-radius: 1em; } */
.organ_img { background: #fcfbfb; border-radius: 1em; box-shadow: 3px 0 10px #ddd; } 
.organ_img .imgCon { width: 100%; max-width: 100%; margin: 0 auto; } 
.organ_img .imgCon img { width: 100%; height: auto; display: block; } 

/* 가맹거래사 찾기 */
.mem_form_wrap { padding: 2.5em; background: var(--crGray1); border-radius: 1em; } 
/* .mem_form_wrap.st2 { border-top-width:3px; border-top-color:var(--siteC2); } */

/* .memList { gap: 1.5em; } 
.memList li { flex: 1 1 48%; border-top: 2px solid var(--siteC); border-radius:2em; max-width: 48%; width: 100%; } 
.memList li .in { border: 1px solid #ddd; padding:1em; border-radius:2em; box-sizing: border-box; gap: 1em; height: 16em; } 
.memList li .imgC { width: 38%; overflow: hidden; } 
.memList li .txtC { width: 58%; } 
.memList li .mem_tit { gap:.5em; border-bottom: 1px dotted #ddd; padding-bottom: .3em; position: relative; } 
.memList li .mem_tit::before { content: ""; position: absolute; bottom: 0; left: 0; width: 25%; height: 1px; background-color: var(--siteC); } 
.memList li .mem_tit .name { font-size: 1.85em; width:28%; } 
.memList li .mem_tit .desc { font-size: 1.15em; } */


.memList { gap: 1.5em; } 
.memList li { flex: 1 1 24%; border-top: 2px solid var(--siteC); border-radius: 2em; max-width: 23%; width: 100%; position: relative; cursor: pointer; } 
.memList li .in { border: 1px solid #ddd; padding: 1em; border-radius: 2em; box-sizing: border-box; gap: 1em; height: 20em; } 
.memList li .imgC { width: 75%; overflow: hidden; } 
.memList li .txtC { width: 100%; } 
.memList li .mem_tit { gap: .5em; border-top: 1px dotted #ddd; padding-top: .3em; position: relative; } 
.memList li .mem_tit::before { content: ""; position: absolute; top: 0; left: 0; width: 25%; height: 1px; background-color: var(--siteC); } 
.memList li .mem_tit .name { font-size: 1.85em; width: 100%; } 
.memList li .mem_tit .desc { font-size: 1.15em; } 

.memT_list { } 
.memT_list .mem_txtL li.lineN { border-top: 0px solid var(--siteC); padding: .5em .3em; } 
.memT_list .mem_txtL li.lineN .tt { padding-left: .5em; position: relative; display: inline; } 
.memT_list .mem_txtL li.lineN .tt::before { content: ""; position: absolute; top: 10px; left: 0;  width: 3px; height: 3px; border-radius: 50%; background-color: var(--siteC); } 
.memT_list .sub_tit{border-bottom: 1px dashed #ddd;}
.memT_list .sub_tit .spot{font-size: 1.05em; word-break: keep-all; font-weight: 800;}
.memT_list .sub_tit .desc{font-size: .95em; word-break: keep-all; font-weight: 500;}
.mem_txtL li { max-width: 90%; } 

/* 약력 박스 기본 숨김 상태 */
.memT_list { position: absolute; left: 50%; top: 98%; transform: translateX(-50%); width: 280px; /* 필요에 따라 조정 */
 background: #fff; border: 1px solid #ddd; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); padding: 1em 1.2em; display: none; z-index: 50; line-height: 1.5; font-size: 0.95em; text-align: left; } 

/* hover 시 약력 박스 보이기 */
.memList li:hover .memT_list { display: block; animation: fadeInUp 0.3s ease forwards; } 

/* 간단한 등장 애니메이션 */
@keyframes fadeInUp { 
 from { opacity: 0; transform: translate(-50%, 10px); } 
 to { opacity: 1; transform: translate(-50%, 0); } 
 }

.memT_list::before { content: ""; position: absolute; top: -8px; left: 50%; transform: translateX(-50%); border-width: 0 8px 8px 8px; border-style: solid; border-color: transparent transparent #fff transparent; filter: drop-shadow(0 -1px 1px rgba(0, 0, 0, 0.1)); /* 살짝 그림자 */}
/* 약력 리스트 내부 스타일 */
.mem_txtL li + li { margin-top: 0.4em; } 

.mem_txtL .tt { color: #333; } 
.mem_form_inp { padding: 3em; background: #fff; border-radius: 1em; box-shadow: 0px 0px 20px rgb(0 0 0 / 8%); } 
.mem_form_inp > li > .meminfo_W { gap: 1.5em; } 
.mem_form_inp > li > .meminfo_W .meminfo_D { flex: 1 1 50%; } 
.mem_form_inp > li { margin-top: 2.25em; } 
.mem_form_inp > li .tit { font-size: 1.063em; font-weight: 600; } 
.mem_form_inp > li:not(.inp_wrap) .tit { margin-bottom: 1em; margin-top: 1em; } 
.mem_form_inp > li .in_txt { padding: .75em 0 1.25em 0; border-bottom: 1px solid #e1e2e6; font-size: 1.063em; color: #333; } 
.mem_form_inp > li .in_inp.flex .in_txt { flex: 1; margin-right: .5em; } 
.mem_form_inp > li .in_icon { margin-bottom: 2em; } 
.mem_form_inp > li .in_icon:last-child { border-bottom: 0; } 
.mem_form_inp > li .in_icon > .icon { width: 6em; height: 6em; background: #f3f6f8; border-radius: 50%; } 
.mem_form_inp > li .in_icon > .icon img { width: 3em; } 
.mem_form_inp > li .check { padding-top: 1em; border-top: 1px dashed #ddd; } 

.mem_form_inp > li.inp_wrap { margin-top: .5em; } 
.mem_form_inp > li.inp_wrap.st1 { margin-top: 2em; } 
.mem_form_inp > li.inp_wrap.mg0 { margin-top: 0; } 
.mem_form_inp > li.inp_wrap .top_tit { width: auto; text-align: center; } 
.mem_form_inp > li.inp_wrap .tit { font-size: 2.25em; font-weight: 700; margin-bottom: 0.4em; } 
.mem_form_inp > li.inp_wrap .t1 { font-size: 1.13em; color: #555; font-weight: 400; } 
.mem_form_inp > li.inp_wrap .inp { flex: 1; } 
.mem_form_inp > li.inp_wrap .inp .select { margin-right: 0.5em; } 
.mem_form_inp > li.inp_wrap > .wrap_in.flex { min-height: 3em; } 

.mem_form_inp > li.cer_wrap { text-align: center; } 

.mem_form_inp > li:first-child { margin-top: 0; } 

.mem_form_inp.st1 > li { padding-right: 2em; } 
.mem_form_inp.st2.flex { gap: .313em; } 
.mem_form_inp.st2.flex.gp1 { gap: 1em; } 
.mem_form_inp.st2.flex > li.inp_wrap .wrap_in.flex { gap: 1em; } 
.mem_form_inp.st2.flex > li.inp_wrap .tit { width: auto; } 

.proTabW { position: relative; } 
.pro-tab { display: flex; align-items: center; gap: 2em; } 
.pro-tab > li { position: relative; } 
.pro-tab > li::before { position: absolute; content: ''; right: -1.2em; top: 50%; transform: translateY(-50%); width: 4px; height: 4px; border-radius: 100px; background: #ccc; } 
.pro-tab > li:last-child::before { display: none; } 
.pro-tab > li > .tabT { padding: .2em .2em; font-size: 1.215em; font-weight: 600; font-family: var(--fontEng); color: #999; cursor: pointer; transition: .2s; } 

.pro-tab > li.on > .tabT { color: var(--siteC); border-bottom: 2px solid var(--siteC); } 
/*quick*/
/* #quick { position: fixed; z-index: 999; top: 50%; right: 1vw; transform: translateY(-50%); } 
#quick .quick_wrap { position: relative; width: 6.25em; border-radius: 2em 2em 6em 6em; box-shadow: 0 .375em .75em rgba(27, 60, 111, .1); text-align: center; overflow: hidden; } 
#quick .quick_wrap:before { content: ""; position: absolute; top: 2em; left: 0; bottom: 0; width: 100%; background: #fff; } 
#quick .quick_wrap > li { position: relative; } 
#quick .quick_wrap > li:not(.top) .in,
#quick .quick_wrap > li .in .tt { display: block; } 
#quick .quick_wrap > li:not(.top) .in { padding: 1.25em .5em; } 
#quick .quick_wrap > li .in .ico { display: inline-block; width: 2.125em; margin-bottom: .625em; transition: .3s; color: var(--siteC); } 
#quick .quick_wrap > li .in .ico img { width: 100%; } 
#quick .quick_wrap > li .in .t1 { font-size: 1.125em; word-break: break-word; color: #fff !important; } 
#quick .quick_wrap > li .in .t2 { font-size: .875em; } 
#quick .quick_wrap > li.tel { } 
#quick .quick_wrap > li.tel .in { padding: 1em .5em; background: var(--siteC); color: #fff; } 
#quick .quick_wrap > li.tel .ico { width: 1.625em; } 
#quick .quick_wrap > li.time { padding: 0 .625em; } 
#quick .quick_wrap > li.time .in { background: #f5f5f5; } 
#quick .quick_wrap > li.top { padding: 1.25em 1.25em; } 
#quick .quick_wrap > li.top .in { width: 3.75em; height: 3.75em; background: var(--siteC); border-radius: 50%; color: #fff; transition: .2s; } 
#quick .quick_wrap > li.top .in .xi { font-size: 1.125em; } 
#quick .quick_wrap > li.top .in .tt { font-size: .750em; } 
#quick .quick_wrap > li:not(.tel) .in[href]:hover .ico { transform: rotateY(180deg); } 
#quick .quick_wrap > li.top .in:hover { background: #787cfd; } 
#quick .quick_wrap > li:not(.top) .in, #quick .quick_wrap > li .in .t2 { color: #333; } */
/*quick*/
.quick_wrapper { } 
#quick { position: fixed; z-index: 99; right: 3em; top: 7.5em; transition: .35s; } 
.quick_wrapper.pCHide #quick { position: fixed; z-index: 99; right: -7em; top: 7.5em; transition: .35s; } 
.quick_wrapper.pCHide #quick.on { position: fixed; z-index: 99; right: 2em; top: 7.5em; transition: .35s; } 
.quick_wrapper.pCHide #quick.on .hide_btn:before { content: '\e93c'}
#quick .quick_wrap { box-sizing: border-box; max-height: 100%; overflow-y: auto; overflow-x: hidden; width: 8em; padding: 1em .5em; background: #fff; border: 1px solid #ddd; box-shadow: 0 .375em .75em rgba(27, 60, 111, .1); border-radius: .6em; } 
#quick .quick_wrap .top { } 
#quick .quick_wrap .top > .in { text-transform: uppercase; text-align: center; margin-bottom: .75em; } 
#quick .quick_wrap .top > .in > i { font-size: .9em; font-weight: 600; letter-spacing: -0.02em; } 
#quick .quick_wrap .link { } 
#quick .quick_wrap .link > .inner { } 
#quick .quick_wrap .link > .inner > .icon { margin: 0 auto; } 
#quick .quick_wrap .link > .inner > .icon > img { height: 25px; object-fit: contain; } 
#quick .quick_wrap .link > .inner > .tit { font-size: .9em; color: #444; text-align: center; font-weight: 600; } 
#quick .quick_wrap .con_w .list > li:nth-child(6) .in .tt { font-weight: 600; } 
#quick .quick_wrap .con_w .list > li .in > img { width: 100%; margin-bottom: .3em; } 
#quick .quick_wrap .con_w .list > li:nth-child(5) .in:hover > img { filter: brightness(0) invert(1); } 
#quick .quick_wrap .con_w .list > li .in { min-height: 2.85em; display: flex; align-items: center; flex-direction: column; justify-content: center; border: 1px solid #ddd; border-radius: .4em; transition: .2s; margin-bottom: .25em; padding: .375em .5em; background: #f9f9f9; } 
#quick .quick_wrap .con_w .list > li .in .xi { font-size: 1.5em; line-height: 1; display: block; margin-bottom: .25em}
#quick .quick_wrap .con_w .list > li .in .tt { font-size: .8em; font-weight: 500; color: #555; } 
#quick .quick_wrap .con_w .list > li .in > i > img { width: 2.5em; height: 38px; object-fit: contain; } 
#quick .quick_wrap .con_w .list > li:hover .in { background: transparent; border: 1px solid var(--siteC); transition: .3s; } 
#quick .quick_wrap .con_w .list > li:hover .in .xi { color: #fff; } 
#quick .quick_wrap .con_w .list > li:hover .in .tt { color: var(--siteC); } 

#quick .quick_wrap .goTop { background: var(--siteC); border-radius: .4em; color: #fff; padding: .35em 0; width: 100%; display: block; text-align: center; } 
#quick .quick_wrap .goTop > .xi { font-size: 1.215em; } 

#quick .hide_btn { display: inline-block; position: absolute; left: -2em; top: 50%; transform: translateY(-50%); width: 3em; height: 5em; background: #fff; border: 1px solid #eee; box-shadow: 0 0 5px rgba(0, 0, 0, .1); z-index: -1; border-radius: 10px; } 
#quick .hide_btn:before { content: '\e93f'; font-family: 'xeicon'; position: absolute; color: #333; font-size: 1.75em; top: 50%; transform: translateY(-50%); transition: .35s; } 

#quick.active { right: -6.25em; } 
#quick.active .hide_btn:before { transform: translateY(-50%) rotate(180deg); } 

/* 찾아오시는 길 */
.location_Bg .map_con { margin-bottom: 6em; } 
.location_Bg .map_con:last-of-type { margin-bottom: 0em; } 
.map_wrap { width: 100%; } 
.map_wrap > .root_daum_roughmap { border-radius: 1em; overflow: hidden; } 
.map_wrap iframe { width: 100%; border-radius: 1em 1em 0 0; overflow: hidden; } 
.root_daum_roughmap .cont .section_address,
.root_daum_roughmap .wrap_controllers { display: none; } 

.location_info { margin-top: -4px; } 
.location_info > .con { display: flex; gap: 3em; background: #222222; padding: 3em 4em; border-radius: 0 0 1em 1em; border: 1px solid #ddd; align-items: stretch; } 
.location_info > .con > .office { width: 20em; border-right: 1px solid #fff; display: flex; align-items: center; } 
.location_info > .con > .office > .tt { font-size: 1.515em; font-weight: 800; color: #fff; } 
.location_info > .con > .address { width: 60%; padding: 1.2em 0; } 
.location_info > .con > .address .tit { font-size: 23px; font-weight: 500; color: #fff; } 
.location_info > .con > .address .tit .xi { margin-right: 0.5em; background: #fff; color: #222; width: 30px; height: 30px; font-size: 20px; line-height: 30px; text-align: center; border-radius: 1em; } 
.location_info > .con > .address > .add_info { display: flex; gap: 2em; align-items: center; margin-top: 1.5em; } 
.location_info > .con > .address > .add_info > li { } 
.location_info > .con > .address > .add_info > li > .call_con { display: flex; align-items: center; gap: .5em; } 
.location_info > .con > .address > .add_info > li > .call_con > .xi { font-size: 1.06em; color: #fff; } 
.location_info > .con > .address > .add_info > li > .call_con > .tt { font-size: 1.06em; color: #fff; } 

.location_info > .con > .map_view { width: 8em; border: 1px solid #fff; border-radius: 1em; display: flex; align-items: center; justify-content: center; flex-direction: column; transition: .2s; color: #fff; } 
.location_info > .con > .map_view > .xi { font-size: 2.15em; } 
.location_info > .con > .map_view > .mapViewT { font-size: 1.063em; font-weight: 500; margin-top: .35em; } 

.location_info > .con > .map_view:hover { opacity: 0.3; } 

/* 월별일정 */
.calendar { width: 60%; } 
.top_wrap .con.con2 { width: 40%; box-sizing: border-box; padding: 3em 0 0 3em; } 
.top_wrap .con.con2 .page_tit .t2 { font-size: 1.38em; margin-bottom: .5em; } 
.Pcon_bd1 { background: #f4f4f4; padding: 2em; box-sizing: border-box; max-height: 31.8em; border-radius: 1em}
.Pcon_bd1 .sche_day { border-bottom: 1px dashed #ddd; margin-bottom: 1em; padding-bottom: 1em; } 
.Pcon_bd1 .sche_day:last-child { border-bottom: unset; margin-bottom: unset; padding-bottom: unset; } 
.Pcon_bd1 .sche_day .date { font-size: .9em; color: #666; } 
.Pcon_bd1 .sche_day .tit { font-size: 1.25em; margin-bottom: 1em; } 
.sche_day .tit a:hover { text-decoration: underline; } 
.sche_day .txt { overflow: hidden; } 
.sche_day .txt strong,
.sche_day .txt span { display: block; float: left; padding: 4px 0; color: #5f6265; line-height: 1.3; } 
.sche_day .txt .t1 { width: 20%; color: #292d31; } 
.sche_day .txt .t2 { width: 80%; } 

.main-tab { gap: .75em; margin-bottom: 3.5em; } 
.main-tab > li { } 
.main-tab .tab-btn { display: flex; cursor: pointer; border: 1px solid #e9e9e9; align-items: center; justify-content: center; height: 3em; background: #fff; position: relative; padding: 0em 2em; border-radius: 3em; font-size: 1.15em; font-weight: 500; color: #333; transition: .3s; font-family: var(--fontBase); } 
.main-tab > li.on .tab-btn { background: var(--siteC); border: 1px solid var(--siteC); color: #fff; font-weight: 600; box-shadow: 3px 6px 12px rgba(0, 0, 0, .1); } 

.main-tab.white .tab-btn { background: #f7f7f7; } 

.con_idx { position: relative}
.con_idx > .idx { position: absolute; left: 0; top: 0; width: 100%; visibility: hidden; filter: alpha(opacity=0); opacity: 0; display: none; } 
.con_idx > .idx.on { position: relative; visibility: visible; filter: alpha(opacity=100); opacity: 1; display: block; } 

.notice_wrap { flex: 1; border: 1px solid #ddd; border-radius: .8em; background: #fff; overflow: hidden; } 
.notice_wrap .notice_top { padding: 1.5em 2em; border-bottom: 1px solid #ddd; } 
.notice_wrap .notice_top .main_tab { gap: 2.5em; } 
.notice_wrap .notice_top .main_tab > li { position: relative; font-size: 1.125em; font-weight: 600; color: #999; } 
.notice_wrap .notice_top .main_tab > li:before { position: absolute; top: 35%; left: -1.2em; width: 5px; height: 5px; background: #999; border-radius: 50%; content: ''; } 
.notice_wrap .notice_top .main_tab > li:first-of-type:before { display: none; } 
.notice_wrap .notice_top .main_tab > li > .tab_btn { } 
.notice_wrap .notice_top .main_tab > li.on { color: #111; font-weight: 700; } 
.notice_wrap .plus { position: absolute; right: 2em; top: -3em; width: 1.5em; height: 1.5em; background: #a6a4a4; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: .25s; } 
.notice_wrap .plus > .xi { color: #fff; } 
.notice_wrap .plus:hover { background: #111; } 
.notice_wrap .notice_list { padding: 1.5em 1.5em; } 
.notice_wrap .notice_list .list_top { } 
.notice_wrap .notice_list .list_top > .con { gap: 1.5em; align-items: center; padding-bottom: 1em; margin-bottom: 1em; border-bottom: 1px dashed #ddd; } 
.notice_wrap .notice_list .list_top > .con .dcon { display: flex; min-width: 4em; flex-direction: column; color: #fff; text-align: center; padding: .5em .8em; background: linear-gradient(to right, #F33 0%, #a40000 90%); border-radius: .5em; } 
.notice_wrap .notice_list .list_top > .con .dcon > .day { font-size: 1.35em; font-weight: 800; } 
.notice_wrap .notice_list .list_top > .con .dcon > .date { font-size: .875em; font-weight: 400; letter-spacing: -1px; } 
.notice_wrap .notice_list .list_top > .con .tit_con { flex: 1; min-width: 0; } 
.notice_wrap .notice_list .list_top > .con .tit_con .tit { margin-bottom: .5em; font-size: 1.125em; font-weight: 600; color: #111; } 
.notice_wrap .notice_list .list_top > .con .tit_con .txt { font-size: .96em; font-weight: 500; color: #444; } 
.notice_wrap .notice_list .list_top > .con .tit_con .tit,
.notice_wrap .notice_list .list_top > .con .tit_con .txt { display: block; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } 

.notice_wrap .notice_list .list_top > .con:hover .tit_con .tit { text-decoration: underline; } 
.notice_wrap .notice_list .list_btm { } 
.notice_wrap .notice_list .list_btm .btm_list { min-height: 7.5em; } 
.notice_wrap .notice_list .list_btm .btm_list > li { border-bottom: 1px dashed #ddd; padding-bottom: .8em; margin-bottom: .8em; } 
.notice_wrap .notice_list .list_btm .btm_list > li:last-child { border-bottom: unset; padding-bottom: unset; margin-bottom: unset; } 
.notice_wrap .notice_list .list_btm .btm_list > li > a { display: flex; gap: 2em; align-items: center; } 
.notice_wrap .notice_list .list_btm .btm_list > li > a > .tit { width: 80%; font-weight: 500; color: #111; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } 
.notice_wrap .notice_list .list_btm .btm_list > li > a:hover .tit { text-decoration: underline; } 
.notice_wrap .notice_list .list_btm .btm_list > li > a > .date { width: auto; font-size: .96em; color: #666; } 
.notice_wrap .nocon { height: 15em; border: none; } 

/* history*/
/*tab*/
.wrap_idx .sub-tab { display: flex; border: 1px solid #ddd; border-radius: 3em; overflow: hidden; } 
.wrap_idx .sub-tab.pd_w { padding-bottom: 3em; } 
.wrap_idx .sub-tab > li { position: relative; margin-left: -1px; cursor: pointer; height: 100%; display: flex; height: 3em; align-items: center; justify-content: center; flex: 1; font-size: 1.15em; font-weight: 700; } 
.wrap_idx .sub-tab > li { flex: 1 25%; border-right: 1px solid #ddd; } 
.wrap_idx .sub-tab > li:last-child { border-right: unset; } 
.wrap_idx .sub-tab > li > .tab_btn { padding: 0 1vw; box-sizing: border-box; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #444; transition: .3s; } 
.wrap_idx .sub-tab > li.on > .tab_btn,
.wrap_idx .sub-tab > li:hover > .tab_btn { background-color: var(--siteC); color: #fff; } 

.wrap_idx .sub-tab.st2 > li { position: relative; margin-left: -1px; cursor: pointer; height: 100%; display: flex; height: 3em; align-items: center; justify-content: center; flex: 1; font-size: 1.15em; font-weight: 700; } 
.wrap_idx .sub-tab.st2 > li { flex: 1 25%; border-right: 1px solid #ddd; } 
.wrap_idx .sub-tab.st2 > li:last-child { border-right: unset; } 
.wrap_idx .sub-tab.st2 > li > .tab_btn { padding: 0 1vw; box-sizing: border-box; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #444; transition: .3s; } 
.wrap_idx .sub-tab.st2 > li.on > .tab_btn,
.wrap_idx .sub-tab.st2 > li:hover > .tab_btn { background-color: var(--siteC); color: #fff; } 

/* 연혁 */
.history-layout { gap: 6em; } 
.history-layout .left { position: sticky; height: 100%; top: 4em; flex: 1 1 45%; } 
.history-layout .left .title-wrap { } 
.history-layout .left .title-wrap > .desc { font-size: 1.15em; color: #444; } 
.history-layout .left .title-wrap > h3 { font-size: 2.515em; margin: .25em 0; font-weight: 800; } 
.history-layout .left .img-wrap { margin-top: 1.5em; height: 20em; position: relative; } 
.history-layout .left .img-wrap img { border-radius: 1em; width: 100%; height: 100%; object-fit: cover; } 
.history-layout .right { flex: 1 1 55%; } 
.history-layout .right .hitory_wrap { } 

.history_bgw { overflow: hidden; position: relative; margin-bottom: 3em; } 
.history_bgw .bg_w { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-position: center top; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; } 
.history_bgw .txt_wrap { text-align: center; } 
.history_bgw .txt_wrap .en { font-weight: 700; padding-bottom: .5em; color: #fff; /*letter-spacing:5px; */
 font-size: 2.5em; } 
.history_bgw .txt_wrap .kr { font-size: 1.125em; color: #fff; margin-bottom: .5em; } 
.history_bgw .line_wrap { position: relative; height: 15em; } 
.history_bgw .line_wrap .line { position: absolute; background: #fff; width: 1px; height: 1px; transition: 1s; opacity: .5; display: none; } 
.history_bgw .line_wrap .line.hor { transition-delay: 1s}
.history_bgw .line_wrap .line.top { top: 0}
.history_bgw .line_wrap .line.bot { bottom: 0}
.history_bgw .line_wrap .line.left { left: 0}
.history_bgw .line_wrap .line.right { right: 0}
.load .history_bgw .line_wrap { margin: 2em 1.5em; } 
.load .history_bgw .line_wrap .line.ver { height: 100%}
.load .history_bgw .line_wrap .line.hor { width: 40%; } 
.load .history_bgw .line_wrap .line { display: block}

.history_wrap { position: relative; padding: 2em 0 2em 0; overflow: hidden; } 
.history_wrap:before,
.history_wrap .scrollAniHis { content: ""; position: absolute; left: 2%; top: 0; width: 2px; height: 100%; background: #ddd}
.history_wrap .history { padding-left: .75em; } 

.history_wrap .scrollAniHis { height: 0; background: var(--siteC); transition: .3s; } 
.history_wrap .scrollAniHis:before { content: ""; position: absolute; top: 0; margin-left: -.5em; width: 1.2em; height: 1.2em; background: #fff; border: .25em solid var(--siteC); border-radius: 100%; box-sizing: border-box}
.history_wrap:after { content: ""; position: absolute; left: 2%; top: 0; margin-left: -.5em; width: 1.2em; height: 1.2em; background: #fff; border: .25em solid var(--siteC); border-radius: 100%; box-sizing: border-box}

.history_wrap.rich .scrollAniHis { background: var(--siteC); } 
.history_wrap.rich .scrollAniHis:before { border: .25em solid var(--siteC); } 
.history_wrap:after { border: .25em solid var(--siteC); } 

.history_wrap:after { top: auto; bottom: 0}
.history_wrap .history > li { margin-top: 6em; flex-direction: column; gap: .5em; } 
.history_wrap .history > li:first-child { margin-top: 0}
.history_wrap .history > li .year { width: 28%; overflow: hidden; padding-left: 2em; } 
.history_wrap .history > li .year .wrap_in { position: relative; } 
.history_wrap .history > li .year .tt { display: inline-block; position: relative; font-size: 2.715em; letter-spacing: -3px; color: var(--siteC); font-weight: 700; } 
.history_wrap .history > li .year .tt:before { content: ""; position: absolute; right: 110%; top: 50%; margin-top: -1px; width: 30%; border-top: 2px solid #ddd; z-index: -1; } 
.history_wrap .history > li .year .tt:after { content: "'"; font-style: italic}
.history_wrap .history > li .list { width: 100%; margin-top: 1em}
.history_wrap .history > li .list > li { margin-top: 1em}
.history_wrap .history > li .list > li:first-child { margin-top: 0}
.history_wrap .history > li .list .wrap_in { padding: 0 2em; /* align-items: center; */
 position: relative; } 
.history_wrap .history > li .list .wrap_in .img_wrap .resize { padding-bottom: 35% !important; } 
.history_wrap .history > li .list .wrap_in .img_wrap .resize .img_r { text-align: right !important; } 
.history_wrap .history > li .list .wrap_in .img_wrap .resize .img_l { text-align: left !important; } 
.history_wrap .history > li .list .month { flex: 0 0 2em; font-size: 1.063em; line-height: 1.4; color: var(--siteC); font-weight: 600; } 
.history_wrap .history > li .list .month .tt { color: #999; font-size: 1.125em; letter-spacing: -1px}
.history_wrap .history > li .list .month .tt:after { content: ""; font-size: .813em; font-weight: 500}
.history_wrap .history > li .list .detail > li { margin-top: .5em}
.history_wrap .history > li .list .detail > li:first-child { margin-top: 0}
.history_wrap .history > li .list .detail .tt { position: relative; color: #333; font-size: 1.063em; line-height: 1.4; font-weight: 400; word-break: keep-all; } 

.histroy-ank { max-width: 70%; margin: auto; margin-top: -2em; box-shadow: 0 10px 10px rgba(0, 0, 0, .1); border-radius: 5em; overflow: hidden; } 
.histroy-ank > li { flex: 1; display: flex; align-items: center; justify-content: center; background: #fff; transition: .35s; border-right: 1px solid #ddd; } 
.histroy-ank > li:hover { background: #012350; } 
.histroy-ank > li:hover .btn-tt { color: #fff; } 
.histroy-ank > li .btn-tt { font-size: 1.75em; font-weight: 600; color: #777; position: relative; transition: .35s; padding: .5em 1em; transition: .35s; width: 100%; text-align: center; } 
.histroy-ank > li .btn-tt.on { background: #012350; color: #fff; } 
.histroy-ank > li .btn-tt:before { content: ''; position: absolute; left: 50%; top: 0; transform: translateX(-50%); background: #2b9cbb; border-radius: 50%; width: .25em; height: .25em; opacity: 0; transition: .35s; } 
.histroy-ank > li .btn-tt:hover:before { opacity: 1; top: -.5em; } 

/*지역지회*/
.sub_In .con { gap: 1.5em; } 
.sub_In .con .txtCon { width: 50%; } 
.sub_In .con .txtCon .tt { border-bottom: 1px dotted #ddd; font-size: 2.05em; font-weight: 700; position: relative; } 
.sub_In .con .txtCon .txt { padding: 1.25em 0; } 
.sub_In .con .txtCon .txt .txtB { width: 100%; background-color: #fafafa; padding: 1em 1.5em; box-sizing: border-box; border-radius: .8em; } 
.sub_In .con .txtCon .txt .txtB li.lineN { border-bottom: 0; } 
.sub_In .con .txtCon .txt .txtB li .t1 { font-size: #111; padding-left: 10px; box-sizing: border-box; font-size: 1.05em; margin-bottom: .5em; position: relative; } 
.sub_In .con .txtCon .txt .txtB li .t1::before { content: ""; position: absolute; width: 3px; height: 3px; border-radius: 50%; top: 8px; left: 0; background-color: #333; } 

.sub_In .con .txtCon .txt .tt1 { font-size: 1.25em; line-height: 1.7; color: #444; margin-bottom: .5em; } 
.sub_In .con .txtCon .tt::before { content: ""; position: absolute; width: 23%; bottom: 0; left: 0; height: 1px; background-color: var(--siteC); } 
.sub_In .con .imgCon { width: 45%; } 
.sub_In .con .imgCon .img { border-radius: 2em; overflow: hidden; object-fit: cover; } 

.fin_box { border-radius: .5em; border: 1px solid transparent; padding: 2em; background: #f5f5f5; display: flex; flex-direction: column; gap: 1.5em}
.fin_box.p1 { padding: 2em}
.fin_box.p2 { padding: 1em}
.fin_box.g1 { gap: .5em}
.fin_box.hl { align-items: flex-start}
.fin_box .tit1 { font-size: 1.75em; font-weight: 700; word-break: keep-all; } 
.fin_box .tit1.s1 { font-size: 1.375em}
.fin_box .tit1.s2 { font-size: 1.125em}
.fin_box .tt1 { line-height: 1.5; font-size: 1.125em; opacity: .7}
.fin_box .tt2 { color: #666; line-height: 1.4}
.fin_box .fs:not(:last-child):after { content: ","}
.fin_box .fin_ico { font-size: 4em; opacity: .1}
.fin_box.st1 { background: none; color: #fff}
.fin_box.st1 .fin_ico { opacity: 1}
.input_st.textarea_w1 { height: 10em; } 

/* sub page */
.work_con { padding-bottom: 3em; } 
.work_con:last-child { padding-bottom: 0; } 
.work_wrap { gap: 1em; align-items: center; } 
.work_wrap.st2 { gap: 2em; align-items: center; } 
.work_wrap .work_left { width: 55%; padding-right: 2em; box-sizing: border-box; } 
.work_wrap .work_left.w1 { width: 100%; height: 16em; } 
.work_wrap .work_left.w1.st2 { width: 100%; height: 15em; position: relative; padding: 1em; box-sizing: border-box; line-height: 2; } 
.work_wrap .work_left.w2 { width: 52%; } 
.work_wrap .work_left .tit { font-size: 2.25em; font-weight: 700; display: inline-block; margin-bottom: .8em; position: relative; } 
.work_wrap .work_left .tit.st2 { font-size: 2.25em; font-weight: 700; display: inline-block; margin-bottom: 0em; position: relative; } 
.work_wrap .work_left .tit::before { content: ''; z-index: -1; position: absolute; bottom: -3px; left: 0; width: 100%; height: 20px; background: #dfeaff; border-radius: 20em; } 
.work_wrap .work_left .tit.st2::before { content: ''; z-index: -1; position: absolute; bottom: -3px; left: 0; width: 0%; height: 20px; background: #dfeaff; border-radius: 20em; } 
.work_wrap .work_left .tit2 { font-size: 2.25em; font-weight: 700; display: inline-block; margin-bottom: .8em; position: relative; } 
.work_wrap .work_left .tit3 { font-size: 2.25em; font-weight: 700; display: inline-block; margin-bottom: .8em; position: relative; } 
.tit2.quotes { position: relative; } 
.tit2.quotes::before { content: " "; position: absolute; width: .5em; height: .5em; background-image: url(../images/inc/Lquotes.svg); background-repeat: no-repeat; background-position: center center; background-size: cover; top: -8px; left: -20px; } 
.tit2.quotes::after { content: " "; position: absolute; width: .5em; height: .5em; background-image: url(../images/inc/Rquotes.svg); background-repeat: no-repeat; background-position: center center; background-size: cover; top: -8px; right: -20px; } 

.work_wrap .tit3::before { content: ''; z-index: -1; position: absolute; bottom: 9px; left: 0; width: 100%; height: 20px; background: #ffdfdf; border-radius: 20em; display: inline-block; } 

.work_wrap .work_left .sub_tit { font-size: 1.25em; color: #222; line-height: 1.6; margin-bottom: 1em; } 
.work_wrap .work_left .sub_tit.st2 { font-size: 1.25em; color: #222; line-height: 1.6; margin-bottom: 1em; background-color: #fefefe; padding: 1em; border-radius: .8em; box-shadow: 3px 3px 5px #ddd; } 
.work_wrap .work_left .sub_tit.st3 { font-size: 1.15em; color: #222; line-height: 1.6; margin-bottom: 1em; background-color: #fefefe; padding: 1em; border-radius: .8em; box-shadow: unset; } 
.work_wrap .work_left .txt { font-size: 1.125em; color: #777; margin-bottom: 1em; line-height: 1.6; } 
.work_con .add { color: #222; margin-top: 5em; } 
.work_con .add.mt2 { margin-top: 2em; } 
.work_con .add .point_c { color: #ff5a00; display: inline-block; vertical-align: top; } 
.work_con .add .add_info { display: inline-block; } 
.work_wrap .work_left .check_list .item .xi { color: #0098ff; min-width: 1.25em; margin-right: .25em; } 
.work_wrap .work_left .check_list .item .txt { color: #555; } 

.page_sec { margin-top: 6em; } 
.page_sec2 { margin-top: 1.5em; } 
.work_wrap .work_right { width: 45%; height: 330px; } 
.work_wrap .work_right.w2 { width: 42%; height: 330px; } 
.work_wrap .work_right.w2.st2 { width: 42%; height: 390px; } 
.work_wrap .work_right .img_box { overflow: hidden; border-radius: 15px; box-shadow: 0 0 20px rgba(0, 0, 0, .15); height: 100%; } 
.work_wrap .work_right .img_box > img { height: 100% !important; width: 100%; object-fit: cover; object-position: center; } 
.work_wrap .work_left.pr_n { padding-right: 0em; padding-left: 2em; } 
.work_wrap .work_left .sub_tit > .highlight { font-size: .9em; } 

.txtA { position: absolute; bottom: -57px; left: 50%; transform: translateX(-50%); z-index: 2; width: 80%; height: auto; background-color: #fefefe; border-radius: .8em .8em 0 0; box-shadow: 3px 3px 3px 0 5px #ddd; overflow: hidden; } 
.txtA.st2 { position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 2; width: 80%; height: auto; background-color: #fefefe; border-radius: .8em .8em 0 0; box-shadow: 3px 3px 3px 0 5px #ddd; overflow: hidden; } 
.txtA.st3 { position: absolute; bottom: -85px; left: 50%; transform: translateX(-50%); z-index: 2; width: 80%; height: auto; background-color: #fefefe; border-radius: .8em .8em 0 0; box-shadow: 3px 3px 3px 0 5px #ddd; overflow: hidden; } 
.txtA .ttW { height: 3.5em; } 

.con_box { padding: 2em 2.5em; } 
.con_box .Blist { width: 100%; } 
.con_box .Blist > li { width: calc((100% - 1.5em) / 4); } 
.con_box .Blist > li .tit_box { background-color: var(--siteC); border-radius: .8em .8em 0 0; height: 3em; font-size: 1.25em; } 
.con_box.mt { margin-top: 3em; } 
.con_box.bg { background-color: #f6f6f6; } 
.con_box.tline { border: 1px solid #ddd; word-break: keep-all; border-radius: 1em; background: #fdfdfd; } 
.con_box.line { border: 1px solid #ddd; border-radius: .5em; } 
.con_box .check_wrap { display: flex; align-items: center; gap: 2em; padding: 0 2em; } 
.con_box .check_wrap .icon { width: 8em; height: 8em; background-repeat: no-repeat; background-position: center center; background-size: contain; padding: 1.5em; border-radius: 50%; border: 2px solid #ddd; display: flex; justify-content: center; align-items: center; box-sizing: border-box; } 
.con_box .check_wrap .icon img { height: 100%; margin-left: 10px}
.con_box .check_wrap .cont { } 
.con_box .check_wrap .cont .tit { margin-bottom: .2em; font-weight: 600; font-size: 1.25em; color: var(--color_dblue); display: block; } 
.con_box .check_wrap .cont .td { margin-bottom: 1.2em; margin-bottom: 1em; font-size: 1.125em; color: #555; } 
.con_box .check_wrap .cont .td:last-child { margin-bottom: 0; } 
.con_box .desc { margin-bottom: 1em; padding-left: 1.5em; } 
.con_box .desc .page_tt + .page_tt { margin-top: .2em; } 
/* .con_tit { position:relative; } 
.con_tit .stroke { font-weight: 800; position: absolute; top: -68px; left: 50%; font-size:5.75em; color: transparent; -webkit-text-stroke: 2px #ddd; } */
.con_box .busi_img + .busi_tit { margin-top: 2em; } 
.con_box .law_wrap { margin-left: 1.5em; } 
.con_box .law_wrap .tit { margin-bottom: 0.5em; font-weight: 600; font-size: 1.125em; color: var(--color_dblue)}
.con_box .law_wrap .cont_list { list-style-type: circle; } 
.con_box .law_wrap .cont_list > li + li { margin-top: 1em; } 
.con_box .law_wrap .cont_list .cont { color: #333; position: relative; } 
.con_box .law_wrap .cont_list .cont .num { padding-right: 0.5em; } 
.con_box .law_wrap .t2 { margin-top: 1em; color: var(--color_lblue)}

.con_box ul.flex { gap: 2.5em; } 
.con_box.st2 ul.flex { gap: 1.5em; } 
.con_box.st2 ul.flex { gap: 1.5em; } 
.sub_box ul.round_L { gap: .5em !important; } 
.sub_box ul.round_L.st2 { gap: 0em !important; } 
.round_L > li { } 
.round_L > li .in { position: relative; width: 12em; height: 12em; } 
.round_L > li .in::before { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; border-radius: 50%; } 
.round_L > li .in.bg1::before { background-color: #fdebf4; opacity: 0.3; } 
.round_L > li .in.bg2::before { background-color: #3CB7D1; opacity: 0.4; } 
.round_L > li .in.bg3::before { background-color: #4D8CBD; opacity: 0.5; } 
.round_L > li .in.bg4::before { background-color: #4D8CBD; opacity: 0.6; } 
.round_L > li .in.bg5::before { background-color: #2E679D; opacity: 0.7; } 
.round_L > li .in.bg6::before { background-color: #214293; opacity: 0.8; } 
.round_L > li .in .txtW { position: absolute; z-index: 2; gap: .3em; } 
.round_L > li .in .txtW .txt_w .t1 { font-weight: 700; color: #fff; font-size: 1.1em; text-shadow: 3px 0 5px #111; } 
.round_L.st3 > li .in { position: relative; width: 15em; height: 15em; } 
.round_L.st3 > li .in::after { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; border-radius: 50%; } 
.round_L.st3 > li .in.bg7::after { background-color: #214293; opacity: 0.3; } 
.round_L.st3 > li .in.bg8::after { background-color: #214293; opacity: 0.55}
.round_L.st3 > li .in.bg9::after { background-color: #214293; opacity: 0.75}
.round_L.st3 > li .in .ico_w { width: 7em; height: 7em; } 


.sub_box { display: flex; align-items: center; padding: 2.25rem 2rem; border-radius: 1rem; background: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, .08); } 
.sub_box .chkwrap { display: flex; flex-direction: column; gap: 0.5em; } 
.sub_box .chkwrap .chkInner { display: flex; align-items: center; gap: 0.5em; } 
.sub_box .chkwrap .chkInner .chkRound { width: 1.5em; height: 1.5em; aspect-ratio: 1 / 1; border-radius: 50%; background: var(--siteC); display: flex; align-items: center; justify-content: center; color: #fff; } 

.sub_box.st1 { flex-direction: column; align-items: flex-start; } 
.sub_box.st1 .img_box { width: 100%; padding-bottom: 30rem; position: relative; overflow: hidden; } 
.sub_box.st1 .img_box img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; } 

.sub_box.st2 { flex-direction: column; align-items: flex-start; border-radius: 0 0 .8em .8em; padding: 1.25rem .8rem; min-height: 7em; } 

.page_tt.dot3 { margin-bottom: .5em; /* padding-left: 1.2em; */
 font-weight: 600; font-size: 1.125em; color: #111; position: relative; } 
.page_tt.ft1 { margin-bottom: .5em; /* padding-left: 1.2em; */
 font-weight: 600; font-size: 1.125em; color: #111; } 
.page_tt.dot3.st2 { margin-bottom: .5em; /* padding-left: 1.2em; */
 font-weight: 600; font-size: 1.125em; color: #555; position: relative; } 
.page_tt.dot3::before { content: "\e92b"; display: inline-block; transform: translateY(2px); margin-right: .3em; font-family: xeicon; color: var(--siteC); /* width:15px; height:5px; border-radius: 5px; background-color:var(--color_lblue); */
 /* position:absolute; left:0; top: 6px; */}

/*개인정보처리방침*/
.agree_wrap { padding: .5em; font-size: .938em; line-height: 1.5; border-top: 2px solid var(--siteC); border-left: 1px solid #ddd; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; box-shadow: 3px 1px 9px rgba(0, 0, 0, .2); padding: 2em; } 
.agree_wrap .agree p { line-height: 1.9; padding: 1em 0; color: #222; } 
.agree_wrap .agree p strong { font-size: 1.3em; } 


.member_agree .agree { padding: 3em; border: 1px solid #ddd; border-top: 2px solid #3c3c3d; font-size: .938em; color: #69696b; font-weight: 300; line-height: 1.4em; } 
.member_agree .agree.H { padding: 1.5em; border-top-width: 1px; height: 7em; overflow-y: scroll; } 
.member_agree .agree p { padding: .5em 0; } 
.member_agree .agree * { vertical-align: baseline; } 
.member_agree .agree strong { color: #3c3c3d; } 
.member_agree .check { padding: 1em 2em; border: 1px solid #ddd; border-top: none; border-radius: 0 0 5px 5px; text-align: right; background: #f9f9f9}
.member_agree h1 { color: #111; font-weight: 600}

.btnWL { border: 1px solid #ddd; border-width: 1px 0px 1px 0px; padding: 1em; box-sizing: border-box; width: 100%; margin-bottom: 20px; } 
.butList { flex: 1 1 16%; gap: 1.5em; } 
.butList > li { font-size: 1.25em; color: #ccc; position: relative; } 
.butList > li::before { content: ""; position: absolute; width: 1px; height: 25px; background-color: #ccc; top: 50%; right: -.5em; transform: translateY(-50%); } 
.butList > li:last-of-type::before { content: ""; position: absolute; width: 1px; height: 0px; background-color: #ccc; top: 50%; right: -.5em; transform: translateY(-50%); } 
.butList > li.on { color: var(--siteC2); font-weight: 800; } 