@charset "UTF-8";

@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css);


body { font-family: 'NanumSquare', sans-serif; font-size: 18px; word-wrap: break-word; word-break: keep-all; font-weight: 300 !important;}
strong { font-weight: 600 !important;}
.hid {position: absolute;left: 0;top: 0;width: 0;height: 0;overflow: hidden;}

.wrap01 { background: url(../img/home_bg.jpg) no-repeat right 0; background-size:cover;}
.wrap02 { background: url(../img/busi_bg.jpg) no-repeat right 0; background-size:cover;}

/*** Backgrounds ***/
.backgrounds {  width: 100%; height: 100%; position: fixed; top:0; -webkit-transform: translateZ(0); transform: translateZ(0); z-index: -1; }
.backgrounds .background { width: 100%; height: 100%; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; position: absolute; left: 0; top: 0; }
/*.overlay:after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; top: 0;  background: #3F51B5; opacity: 0.8; }*/

/*HEADER*/
.header {z-index: 10; padding: 100px 0; position: fixed; top: 0; width: 100%;}
.header h1.logo { position: absolute; left: 5%; top:100px}
.header ul.nav { max-width:1800px; width: 100%; margin: 0 auto; position: relative;}
.header ul.nav li { display: inline-block; width: 19%; text-align: center;}
.header ul.nav li a { color: #fff; font-family: 'Oswald', sans-serif;}
.header ul.nav li a:hover,
.header ul.nav li a.on { color:#fcb811}
.mo_menu { display: none;}

/*FOOTER*/
.foot_area { width: 100%; background: #fff; position: fixed; bottom: 0; padding: 25px 0 15px;}
.footer { max-width: 1800px; margin: 0 auto; font-size: 14px;  font-family: 'Oswald', sans-serif; color:#383435}
.footer .footer_logo { font-size: 20px; font-weight: 600; color:#221e1f; letter-spacing: 2px;}
.footer ol { margin: 5px 0;}
.footer strong { font-weight: 600; color:#221e1f; letter-spacing: 2px;}
.footer small { font-size: 10px;}

.on_box { position: absolute; left: 42%; bottom:20%;}
.on_box span { display: inline-block; border-radius: 10px; border: 2px solid #fff; margin-right: 8px; position: relative; width: 15px; height: 15px;}
.on_box span i { position: absolute;left: 0;top: 0; width: 0;height: 0;overflow: hidden;}
.on_box span.on { border: 2px solid #fcb811; background:#fcb811;}

@media (max-width:2100px){

    .header ul.nav,
    .footer { max-width:1280px;}

}

@media (max-width:1600px){

    .header ul.nav {padding-left: 255px;}
    .footer { margin: 0 5%;}

}

@media (max-width:1024px){

    .header h1.logo { top:45px;}
    .header ul { display: none;}
    .mo_menu { display: block;}
    
    .open_nav { background: url(../img/side_menu_ico.png) no-repeat 0 0; width:47px; height: 37px; position: absolute; top:40px; right: 35px; z-index: 999;}
    .sidenav_bar {height: 100%; width: 0;position: fixed; z-index: 9999;top: 0; right: 0;background-color: #fff;overflow-x: hidden;transition: 0.5s;padding-top: 60px; overflow: hidden;}
    .sidenav_bar a {padding: 8px 8px 8px 32px;font-size:1.5rem;color: #2a2a2a;display: block;transition: 0.3s;}
    .sidenav_bar .closebtn {position: absolute;top: 0;right: 25px;font-size:3.5rem;margin-left: 50px;}
    .sidenav_menu {display: block !important;} 
    .sidenav_menu>li { display: block; width: 100%;} 
    .sidenav_menu>li>a { text-align: right; font-size:1.375rem; font-weight: 600; color:#2a2a2a;display:block;padding:0px 15%; height: 92px;line-height: 92px; transition: 0.4s; width: 100%; background: #fff;}
}

@media (max-width:960px){
    
    .fullpage-wrapper { height: auto !important;}

    .header { background: #000; padding: 0; height: 95px;}

    .header h1.logo { top: 30px;}
    .header h1.logo img { width: 50%;}
    .open_nav {top: 30px; right: 5%;}

    .foot_area { position: relative;}

    .on_box { display: none;}

}

/****** CONTENT_ARAR ******/
.ko { font-family: 'NanumSquare', sans-serif !important; letter-spacing: 0 !important;}
.mail_t { font-family: 'Oswald', sans-serif !important;}

.cont_area { margin: 260px 5% 0 42%; color:#fff;}
.cont_area h2 { font-family: 'Oswald', sans-serif; font-size: 42px; letter-spacing: 2px; line-height:1; padding-bottom: 10px;}
.cont_area h2 span { font-weight: 300 !important;}
.cont_area h2 p { font-family: 'NanumSquare', sans-serif; font-size: 22px; letter-spacing: 0; margin: 15px 0; line-height:1.4;}
h3 { font-family: 'Oswald', sans-serif; font-size: 18px; color:#fcb811; margin: 15px 0 8px; font-weight: 600 !important}
h3>p { font-weight: 300;}
.cont_area ul.flat_li li { position: relative; display: inline-block; padding: 0 15px;}
.cont_area ul.flat_li li:first-child { padding: 0 15px 0 0;}
.cont_area ul.flat_li li:after { position: absolute; top:7px; right:-2px; content: ""; display: block; width: 1px; background:#fcb811; height:12px;}
.cont_area ul.flat_li li:last-child:after { display: none;}

.txt_box { line-height: 1.4; width: 100%;}
.txt_box .txt_yellow {  font-size: 20px; color:#fcb811; font-weight: 600;}
.txt_box ul { margin-bottom: 25px;}

.radius_box { display:table; margin: 15px 0; overflow: hidden; border-radius: 30px; border: 2px solid #fcb811; background: url(../img/radius_bg.png) repeat 0 0; padding:15px 30px;}
.radius_box h3 { font-weight: 300 !important;}
.radius_box ul li { display: inline-block;}
.circle { min-width: 160px; min-height: 160px; padding: 40px 0; border-radius: 85px; margin: 25px 10px; letter-spacing: 2px; border: 2px solid #fff; background: url(../img/radius_bg2.png) repeat 0 0; text-align: center; color:#fff; font-family: 'Oswald', sans-serif;}
.circle_y { display: table; min-width: 140px; min-height: 140px; padding: 40px 0; border-radius: 85px; margin: 10px; letter-spacing: 2px; border: 2px solid #fcb811; background: url(../img/radius_bg2.png) repeat 0 0; text-align: center; color:#fcb811; font-family: 'Oswald', sans-serif;}

.busi_dl dt { display: inline-block;}
.busi_dl dd { display: inline-block; width: 65%;}
.li_type { margin: 15px 10% 45px 0;}
.li_type li { padding: 0 0 12px;}

.section01 { position: relative; overflow: hidden;}


@media (max-width:1024px){

    .cont_area { margin:25% 5%;}

}

@media (max-width:960px){

    .cont_area h2 {font-size: 36px;}
    .cont_area { margin:15% 5%;}

}

@media (max-width:700px){

    .cont_area { margin:120px 5%;}

    .cont_area ul.flat_li li { display: block; padding: 0;}
    .cont_area ul.flat_li li:after { display: none;}

}

@media (max-width:500px){

    .cont_area h2 span { display: block;}
    .busi_dl { margin-bottom: 25px;}
    .busi_dl dd { width: 100%;}

    .radius_box { display:block; padding: 15px;}
    .circle { min-width: 120px; min-height: 120px; width: 120px; height: 120px; padding:15px 0; margin: 25px auto;}

}