@charset "utf-8";

/* 모바일에서 않보임 */
.pc_blok{display: none !important;}
.lay_popup{display: none;}

#wrap{width: 100%;position: relative}
/* header */
#header{width: 100%;position: fixed;z-index: 101;}
    .head_wrap{width: 100%;}
    .head_line{border-bottom: 1px solid #e5e5e5}
    .head_default{position: absolute;top:0;z-index: 100;}
    .head_default h1{background: url('../../images/common/logo.png') no-repeat 0 -36px;}
    .head_default .gnb_nav > li > a{color: #000;}
    .head_default .utile_nav li a{color: #000;}

    .head_default .utile_nav li a::after{color: #fff;background-position: 0 0;}
    .head_default button.btn_search_open{background-position: 0 0;}
    .head_default button.btn_fullMenu{background-position: 0 0;}

    /* header 이미지에 따라 변경되는 색상 */
    .head_backg_colorRe h1{background: url('../../images/common/logo.png') no-repeat 0 0px;}
    .head_backg_colorRe .gnb_nav > li > a{color: #000;}
    .head_backg_colorRe .utile_nav li a{color: #000;}
    .head_backg_colorRe .utile_nav ul li:last-child a{color: #000;}
    .head_backg_colorRe .utile_nav li a::after{color: #000;background-position: 0 -12px;}
    .head_backg_colorRe button.btn_fullMenu{background-position: 0 -25px;}

    .head_backg_colorRe .utile_nav button.btn_search_open{background-position: 0 -17px;}
    .head_backg_colorRe .utile_nav ul::after{content: "|";width: 1px;float: right;display: inline-block;margin-top: -15px;font-size: 0.7rem;color: #333;}

    /* header 고정 형태 */
    .head_fix{position: fixed;top:0;z-index: 100;background-color: #d20004;}
    .head_fix h1{background: url('../../images/common/logo.png') no-repeat 0 -36px;}
    .head_fix .gnb_nav > li > a{color: #fff;}
    .head_fix .utile_nav li a{color: #fff;}
    .head_fix .utile_nav li a::after{color: #fff;background-position: 0 0;}
    .head_fix button.btn_search_open{background-position: 0 0;}
    .head_fix button.btn_fullMenu{background-position: 0 0;}

    /* header active 형태 */
    .head_active{background-color: #d20004;}
    .head_active h1{background: url('../../images/common/logo.png') no-repeat 0 -36px;}
    .head_active .gnb_nav > li > a{color: #fff;}
    .head_active .utile_nav li a{color: #fff;}
    .head_active .utile_nav li a::after{color: #fff;background-position: 0 0;}
    .head_active button.btn_search_open{background-position: 0 0;}
    .head_active button.btn_fullMenu{background-position: 0 0;}

    .head_wrap > button.mob_btn_menu{width: 50px;height: 50px;display: block;position: absolute;left:0;z-index: 8;background: #e00000 url("../../images/common/mob_btn_menu.png") no-repeat center;background-size: 50%;}

    .head_wrap > button.mob_btn_menu_close{width: 14.53125%;height: 50px;display: block;left: auto;right: 0;z-index: 10001;background: #000 url("../../images/common/mob_btn_menu_close.png") no-repeat 70% center;background-size: 50%;}

    .utile_nav{width: 100%;height: 50px;position: fixed;top: 0;right: 0;z-index: 7;}
        .utile_nav ul{position: absolute;top: 15px;right: 45px;}
		.utile_nav ul::after{content: "|";width: 1px;float: right;display: inline-block;margin-top: -15px;font-size: 0.7rem;color: #fff;}
        .utile_nav ul li:first-child{display: none;}
        .utile_nav ul li:last-child a{font-size: 0.9286rem;color: #fff;position: relative;top: 3px;right: 10px;}
        .utile_nav button.btn_search_open{width:47px;position: absolute;top: 15px;right: -15px;text-indent: -10000px;background: url("../../images/common/gnb_icon_search.png") no-repeat 1px 3px;background-size: 70%;}
        .utile_nav.zIndex {z-index:10;}
        .util_Bg ul::after{color: #000;}
        .util_Bg ul li:last-child a{color: #000;}/* 스크롤 이동시 폰트 색상 변화 */
        .util_Bg{width: 100%;height: 50px;background: #fff;opacity: 0.9;z-index: 7;}/* 스크롤시 변경되는 배경 */
        .util_Bg button.btn_search_open{width:47px;position: absolute;top: 15px;right: -15px;text-indent: -10000px;background: url("../../images/common/gnb_icon_search.png") no-repeat 1px -17px;background-size: 70%;}

        .mob_logo{width: 100%;padding-bottom: 7%;background: #fff;}
            .mob_logo span{width: 97px;height: 38px;display: inline-block;margin: 11% 0 0 7.5%;background: url('../../images/common/logo02.png') no-repeat 0 0;background-size: 60%;}
            .mob_logo > a{display: inline-block;float: right;margin: 11% 7% 0 0;font-size: 0.8125rem;font-weight: 500;}
            .mob_logo > a::after{content: "";width: 14px;height: 10px;margin: 0 0 0 5px;display: inline-block;vertical-align: middle;background: url('../../images/common/icon_eng.png') no-repeat center 0;background-size: 70%;}

        #nav{width: 85.46875%;height: 100%;position: fixed; top: 0;left: 0;z-index: 1000;background: #fff;display: none;}
        #nav:before {content:"";position:fixed;right:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,.8);z-index:-1}
            .gnb_nav{height: calc(100% - 85px);overflow-y: scroll;background: #fff;}
            .gnb_nav > li.select ul{width:100%;margin-top:-1px;display: inline-block;border-top: 1px solid #e3e3e3;background: #fff;}
            .gnb_nav > li ul{margin-top:-1px;display: none;border-top:1px solid #ddd;}
            .gnb_nav > li.select{}
            .gnb_nav > li.select > a{width: 85.2%;margin-left: 7.8125%;color:#e00000;border-bottom: 1px solid #e3e3e3;}
			.gnb_nav > li > ul > li.select > a{color:#e00000}
            .gnb_nav > li > a{width: 85.2%;height: 50px;line-height: 50px;margin-left: 7.8125%;display: block;position: relative;border-bottom: 1px solid #d4d4d4;box-sizing: border-box;}
            .gnb_nav > li > ul > li{width: 100%;margin-top: 0;display: inline-block;background: #fbfbfb;}
            .gnb_nav > li > ul > li > a{width: 100%;margin: 0 auto 0;display: table;position: relative;line-height: 50px;font-size: 0.875rem;font-weight: 300;background: #fbfbfb;}
            .gnb_nav > li > ul > li > a::before{content: "•";width: 10px;padding-left: 3%;margin-left: 1.7%;display: inline-block;font-size: 10px;font-weight: 300;vertical-align: top;}
            .gnb_nav > li > ul > li:first-child{display: none;}
			.gnb_nav > li > ul > li:last-child{border-bottom:1px solid #ddd;}
            .mob_3depth li{width: 100%;}
            .mob_3depth li strong{width: 100%;position: relative;padding: 5% 7.8125%;margin: 0 auto 0;display: block;font-size: 0.875rem;font-weight: normal;color: #666;border-bottom: 1px solid #e3e3e3;box-sizing: border-box;}
            .mob_3depth li:last-child strong{margin-bottom: 0;}
            .mob_3depth li strong + ul{margin-top: -1px;}
            .mob_3depth li strong span{width: 20px;margin-top: 12px;margin-right: -2px;display: inline-block;float: right;}
            .mob_3depth li:first-child strong{border-top:none;}
            .mob_3depth li.on_menu_3depth strong{position: relative;}
            .mob_3depth ul{width: 100%;}
            .gnb_nav li ul li ul.mob_3depth{width: 100%;margin: 1px 0 0 0;}
            .mob_3depth > li{width: 100%;padding: 0 0 0 0;background: #f5f5f5;}
            .mob_3depth > li > a {width: 50%;color: #666;min-height: 48px;padding: 5% 0;display: table-cell;float: left;font-size: 0.875rem;text-align: center;color: #898989;border-right: 1px solid #e3e3e3;border-bottom: 1px solid #e3e3e3;box-sizing: border-box;background: #fff;}
            .mob_3depth li li a{width: 50%;min-height: 48px;padding: 4% 0;display: table-cell;float: left;font-size: 0.875rem;text-align: center;color: #898989;border-right: 1px solid #e3e3e3;border-bottom: 1px solid #e3e3e3;box-sizing: border-box;background: #fff;}
            .mob_3depth li ul::after{content: "";clear: both;}
            .mob_3depth > li > ul{display: none;}

            span.boxSpan3_on:before{content:''; height:1px; width:9px;margin: -5px auto 0;display:block; background:#e00000;}
            span.boxSpan3:before, .boxSpan3:after{content:''; height:1px; width:9px;margin: -5px auto 0;display:block; background:#666;}
            .boxSpan3:after{height:9px; width:1px; top:24px; right:7px; }

            .boxSpan4{height:18px; width:18px; display:block; position:absolute;top: 16px;right: 7.2%;background: #fbfbfb;}

            .select span.boxSpan1{height:20px; width:20px; margin-top: 15px;margin-right: 0;display: inline-block;float: right;background: #e00000;}
            .select span.boxSpan1:before{content:''; height:1px; width:9px;margin: 10px auto 0;display:block; background:#fff;}
			.select_on span.boxSpan1{height:20px; width:20px; margin-top: 15px;margin-right: 0;display: inline-block;float: right;background: #e00000;}
			.select_on span.boxSpan1:before{content:''; height:1px; width:9px;margin: 10px auto 0;display:block; background:#fff;}

            .gnb_nav > li > a > span.boxSpan2{height:18px; width:18px; display:block; position:absolute;top: 16px;right: 0;border: 1px solid #d5d5d5;background: #fff;}
            .gnb_nav > li > a > span.boxSpan2:before, .boxSpan2:after{content:''; height:1px; width:7px; display:block;background:#666; position:absolute; top:9px; left:5px;}
            .boxSpan2:after{height:7px; width:1px; top:6px; left:8px; }

        .mob_sns{/* width: 100%;height: 64px;position: absolute;bottom: 0;text-align: center;background: #333; */display:none;}
        .mob_sns li{width: 38px;height: 35px;display: inline-block;margin: 15px 8% 0;text-indent: -100000px;background: url("../../images/common/mob_icon_sns.png") no-repeat;background-size: 100%;}
        .mob_sns li:nth-child(1){background-position: 0 0;}
        .mob_sns li:nth-child(2){background-position: 0 -35px;}
        .mob_sns li:nth-child(3){background-position: 0 -70px;}

    /* search */
    button.btn_search_open{width:32px;top: 18px;right: 0px;background: url("../../images/common/gnb_icon_search.png") no-repeat 0 0;background-size: 100%;}
    button.btn_fullMenu{width:28px;top:5px;right: 50px;background: url("../../images/common/gnb_icon_fullMenu.png") no-repeat 0 0;}
    button.btn_search_open, button.btn_fullMenu{height: 18px;position: absolute;text-indent: -10000px;}
    .search_area{display: none;position: absolute;top: -30px;left: 0;z-index: 13;width: 100%;height: 83px;background: rgba(231, 24, 28, 1)}
    form.search_form{position: absolute;width: 100%;left: 0;}
        form.search_form > select, form.search_form > input{float: left}
        form.search_form > input{width: 63%;margin-top: 30px;padding: 15px;border: none;font-size: 1rem;color: #fff;}
        form.search_form > input::placeholder{color: #fff;}
        .btn_search{width:46px;height: 46px;position: absolute;top: 29px;right: 52px;z-index: 12;text-indent: -10000px;background: url("../../images/common/m_icon_search.png") no-repeat 8px 18px;background-size: 50%;}
        .btn_close_search{width: 53px;height: 53px;position: absolute;top: 30px;right: 0px;z-index: 1;text-indent: -10000px;background:#333  url("../../images/main/m_serch_close.png") no-repeat center;background-size: 36%;}

/* container */
#container{width: 100%;position: relative;padding-bottom: 35%;}
    .container_wrap{width: 100%;height: 100%;position: relative;top: 560px;z-index: 9;}
    .main_visual::after{content: "";width: 100%;height: 50px;position: absolute;bottom: 0px;z-index: 1;display: inline-block;background: url('../../images/main/head_saline.png') no-repeat;background-size: ;}
    .swiper-container{padding: 0 0 60px;}
    .inner{padding-bottom: 0px;}
    .inner2{padding-top: 30px;padding-bottom: 0px;}
    .sub_container_wrap{width: 100%;position: relative;top: 52px;z-index: 9;}
    h3.mob_title{padding: 18px 0;border-bottom: 1px solid #b5b5b5;text-align: center;font-size: 1.5rem;}
    h3.mob_title span{display: block;text-indent: -100000px;background: url("../../images/contents/m_allways_logo.png") no-repeat center;background-size: contain;}


    /* sub_conts */
    .sub_conts{width: 100%;min-width: 100%;position: relative;}
        .sub_conts h3{width: 100%;margin: 0 auto 0;font-size: 1.25rem;font-weight: 500;}
        .sub_conts > p{width: 100%;margin: 8px 0 0;color: #333;}
        .innerArea{width: 100%;display: block;}

.posi_L00, .posi_R00{margin-top: -70px !important;}

/* footer */
#footer{position: relative;z-index: 9;padding-bottom: 0px;background: #fff;}
    .custom_Zone{padding: 0 0;position: relative;z-index: 9;background: #333;color: #fff;}
        .custom_Zone::before{content: "";width: 100%;height: 50px;position: absolute;top: -50px;display: inline-block;background: url('../../images/main/foot_saline.png') no-repeat;background-size: ;}

        .foot_en{width: 100%;background: #383838;}
        .addA_en{margin: 0 0 0 10%;box-sizing: border-box;}
            .addA_en h2{width: 86px;height: 34px;padding-top: 10px;display: block;text-indent: -10000px;background: url('../../images/common/enM_foot_logo.png') no-repeat;}
            .addA_en strong{padding-top: 20px;display: inline-block;font-weight: 400;}
            .addA_en p{padding: 10px 0 30px;text-align: left;font-size: 12px;color: #898989;}

/* input designs */
    .checks input[type="checkbox"]{position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0,0,0,0);border: 0;}
    .checks input[type="checkbox"] + label {display: inline-block; position: relative; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;font-size: 0.8125rem;}
    .checks input[type="checkbox"] + label:before {content: ''; display: inline-block; width: 20px;height: 20px;margin: -2px 5px 0 0; text-align: center; vertical-align: middle; background: url("../../images/common/checkbox_off.png") no-repeat -2px -3px;}
    .checks input[type="checkbox"] + label:active:before, .checks input[type="checkbox"]:checked + label:active:before {}
    .checks input[type="checkbox"]:checked + label:before {content: '';background: url("../../images/common/checkbox_on.png") no-repeat -2px -3px;}

/* !important 적용 */
.btn_fullMenu{display: none;}

.main_visual .img_area a{height:fit-content;display:block;}
.main_visual img{width: 100%}
.main_visual video{width: 100%}
.full_nav{display: none;}
.inner h3{display: none;}
.loction_nav{display: none;}
.areaWd90{width: 90% !important;}
.posi_T140{bottom: 25% !important;}
.posi_B_10{bottom: -10px !important;}
.posi_B10{bottom: 15px !important;}
.posi_B60{bottom: 60px !important;}
.padd_t0{padding-top: 0 !important;}
.padd_t20{padding-top: 20px !important;}
.padd_b0{padding-bottom: 0 !important;}
.contein_padd_b40{padding-bottom: 40% !important;}
.padd_b20{padding-bottom: 20px !important;}

.marg_t25{padding-top: 25% !important;}
.m_ml10{margin-left: 3.5% !important;}
.clear{clear: both;}
/* css 기호 */
    /*.css-arrow{display: inline-block;position: relative;margin: 5px 0 0 10px;padding: 0;width: 0;height: 0;border: 4px solid transparent;border-left-color: #000;}
    .css-arrow:before, .css-arrow:after{display: block;content: "";position: absolute;top: 0;width: 0;height: 0;}
    .css-arrow:before{left: -13px;margin-top: -4px;border: 4px solid transparent;border-right-color: #000;}
    .css-arrow:after{left: -9px;margin-top: -8px;border: 8px solid transparent;border-left-color: #f5f5f5;}*/

    .css-arrow01{display: inline-block;position: absolute;right: 2px;margin: 5px 0 0 10px;padding: 0;width: 0;height: 0;border: 4px solid transparent;border-left-color: #000;}
    .css-arrow01:before, .css-arrow01:after{display: block;content: "";position: absolute;top: 0;width: 0;height: 0;}
    .css-arrow01:before{left: -13px;margin-top: -4px;border: 4px solid transparent;border-right-color: #000;}
    .css-arrow01:after{left: -9px;margin-top: -8px;border: 8px solid transparent;border-left-color: #fbfbfb;}

/*@media only screen and (min-width:412px) and (max-width:425px){
    .container_wrap{top:640px;}
}
@media only screen and (width:375px){
    .container_wrap{top:580px;}
}*/
@media only screen and (max-width:320px){
    .footer_wrap h2{top:-190px;}
}

input::-webkit-input-placeholder {color: #999;}
input:focus::-webkit-input-placeholder {color: transparent;}
/* Firefox < 19 */
input:-moz-placeholder {color: #999;}
input:focus:-moz-placeholder {color: transparent;}
/* Firefox > 19 */
input::-moz-placeholder {color: #999;}
input:focus::-moz-placeholder {color: transparent;}

/* Internet Explorer 10 */
input:-ms-input-placeholder {color: #999;}
input:focus:-ms-input-placeholder {color: transparent;}


@media (width: 568px), handheld and (orientation: landscape){

}

@media (width: 640px), handheld and (orientation: landscape){

}

@media (width: 667px), handheld and (orientation: landscape){

}

@media (width: 736px), handheld and (orientation: landscape){
.inner{padding-bottom:50px;}
}

.ico_scroll{display:none;}