@charset "UTF-8";

#container {margin-top: 40rem;}
#container > .wrap {position: relative;}

@media all and (max-width:1240px) {
    #container {margin-top: 30rem;}
    #container > .wrap {width: 100%;}
}

@media all and (max-width:768px) {
    #container {margin-top: 10rem;}
    #container > .wrap {width: 100%;}
}

@media all and (max-width:480px) {
#container {margin-top:0;}
#container {margin-top:0;}
}

#snb {position: absolute; top:185rem; left: 0; width: 250rem;border-radius: 0 20rem 20rem 20rem;background: #fff;overflow: hidden;box-shadow: 6rem 8rem 27rem 0rem rgba(0, 0, 0, 0.1);}
#snb > h2 {padding: 60rem 10rem; background: #007733; color: #fff;font-family: 'Elice DX Baeum OTF', sans-serif;font-weight: 700;font-size: 24rem;line-height: 1.3;text-align: center;}
#snb > .snb {padding: 0 30rem;}
#snb > .snb > li {border-bottom: 1px solid #dddddd;}
#snb > .snb > li:first-child {margin-top: 15rem;}
#snb > .snb > li:last-child {margin-bottom: 35rem;}
#snb > .snb > li > a {display: block;padding: 18rem 30rem 18rem 0;position: relative;}
#snb > .snb > li > a::after {content: '→';display: block;width: 18rem;height: 18rem;font-size:9rem;background: #f1f1f1;border-radius: 4rem;font-family:'SUIT', sans-serif;color: #797979;text-align: center;line-height: 18rem;position:absolute;top: 50%;transform: translateY(-50%);right: 0;box-sizing: border-box;}
#snb > .snb > li.on > a::after {background: #007733;color: #fff;}
#snb > .snb > li > a > span {font-size: 18rem; font-weight: 500;}
#snb > .snb > li > a[target="_blank"] > span {position: relative; padding-right: 22rem;  background: url('../img/content/t_blank.png') no-repeat right;}
#snb > .snb > li.on > a > span {font-weight: 600;color: #007733;}

@media all and (max-width:1240px) {
    #snb {display: none;}
}

#sub_top {position: relative;padding: 80rem 20rem;}
#sub_top::after {position:absolute;content: '';display: block;width: 100%;height: 100%;top:0;left:0;z-index:-1;background: #fff1cd url('../img/sub/subtop_bg.png') no-repeat center;border-radius: 20rem 0 20rem 20rem;}
#sub_top h3 {font-family: 'Elice DX Baeum OTF', sans-serif;font-weight: 700;font-size: 44rem;text-align: center;flex-direction: column}

#sub_top .breadcrumb {display: flex;align-items: center;justify-content: center;}
#sub_top .breadcrumb > li::after {content: '→';font-family:'SUIT', sans-serif;font-size: 12rem;margin: 0 12rem;}
#sub_top .breadcrumb > li:last-child::after {display: none;}
#sub_top .breadcrumb > li > a {font-size: 16rem;} 
#sub_top .breadcrumb > li.on > a {font-weight: 700;}


#sub_top .util {display: flex;position: absolute;bottom: -25rem;right: 100rem; z-index: 30;}
#sub_top .util > li {margin-left: 16rem;}
#sub_top .util > li > a {display: block;width: 50rem;height: 50rem;text-indent: -9999rem;border-radius: 8rem;}
#sub_top .util > li.share > a {background: #ffd163 url('../img/sub/icon_share.png') no-repeat center;}
#sub_top .util > li.print > a {background: #ffd163 url('../img/sub/icon_print.png') no-repeat center;}

#sub_top .util > li.share {position: relative;}
#sub_top .util > li.share > ul {position: absolute; top: 55rem;right: 0;display: none;}
#sub_top .util > li.share > ul a {display: block;width: 50rem;height: 50rem;text-indent: -9999rem;border-radius: 8rem;margin-bottom: 5rem;}
#sub_top .util > li.share > ul .fb a {background: #0866ff url('../img/sub/share_icon.png') no-repeat 0% center;background-size: 300%;}
#sub_top .util > li.share > ul .x a {background: #323232 url('../img/sub/share_icon.png') no-repeat 50% center;background-size: 300%;}
#sub_top .util > li.share > ul .band a {background: #21c531 url('../img/sub/share_icon.png') no-repeat 100% center;background-size: 300%;}

@media all and (max-width:1240px) {
    #sub_top {padding: 60rem 20rem;}
    #sub_top::after {border-radius: 0;}
}
@media all and (max-width:768px) {
    #sub_top::after {background-size: 720rem;}
    #sub_top h3 {font-size: 40rem;}
	
}
@media all and (max-width:480px) {
    #sub_top::after {background-size: 650rem;}
    #sub_top .util {right: 50%;transform: translateX(50%);}
	#sub_top h3 {font-size:34rem;}
	#sub_top .breadcrumb > li::after {margin: 0 8rem;}
	

}

#content {width:calc(100% - 450rem);min-height: 500rem;margin-top:100rem;margin-left:350rem;margin-bottom: 260rem;padding-bottom: 50rem;}
#content.long::before {content: ''; display: block; width: 304rem; height: 656rem;position: absolute;left: 0rem;top: 50%;background: url('../img/sub/sub_bg.png') no-repeat center;z-index: -1;}
@media all and (max-width:1675px){
    #content {width:calc(100% - 350rem);}
}
@media all and (max-width:1240px) {
    #content {width:calc(100% - 80rem);min-height: unset;margin: 80rem auto 200rem !important;}
    #content.long::before {display: none;}
}
@media all and (max-width:980px) {
    #content {width:calc(100% - 60rem);}
}
@media all and (max-width:720px) {
    #content {width:calc(100% - 40rem);margin: 80rem auto 120rem !important;}
}

@media all and (max-width:480px) {
#content {padding-bottom:0; margin: 80rem auto 80rem !important;}

}

#footer > .wrap {position: relative;}
#footer > .wrap::before {content:'';display: block;position: absolute;width:calc(100% - 450rem);max-width:1600rem;height: 173rem;background: url('../img/sub/subbottom_bg.png') no-repeat left bottom;background-size: contain;top: -243rem;left: 350rem;}
@media all and (max-width:1675px){
    #footer > .wrap::before {width:calc(100% - 350rem);}
}
@media all and (max-width:1240px) {
    #footer > .wrap::before {width:calc(100% - 80rem);height: 190rem;top: -260rem;left: 50%;transform: translateX(-50%);}
}
@media all and (max-width:980px) {
    #footer > .wrap::before{width: calc(100% - 60rem);}
}
@media all and (max-width:720px) {
    #footer > .wrap::before{width: calc(100% - 40rem);height: 120rem;top: -190rem;}
}
@media all and (max-width:480px) {
    #footer > .wrap::before{display: none;}
	
}

/*외국어*/
@media all and (max-width:1240px) {
#container .wrap.en #sub_top .util {right: 30rem; transform:none;}

}
