/* html {
    overflow: hidden;
} */
.mainWrap { width: 100%; position: relative; overflow: hidden; margin: 0 auto; max-width: 720px; }
.mainWrap img { width: 100%; display: block;}
.visualWrap{ width: 100%; padding-top: 51.5%;  position: relative;}
.visualWrap::after{ width: 100%; height: 10%; display: block; position: absolute; bottom: 0; left: 0; content: ''; background: url("../images/main/bar_bg.png") no-repeat bottom left; background-size: contain;}
.visualWrap video{ width: 100%; position: absolute; top: 0; left: 0;}
.visualWrap .scroll { width: 10%; position: absolute; bottom: 40px; left: 45%;}


.sec2 { width: 100%;  position:relative;   overflow: hidden;}
.sec2 .bg { width: 100%;}
.sec2 .textWrap { width: 100%; position: absolute; top: 0; left: 0}
.sec2 .nth1 { width: 100%; position: absolute; bottom: 0; left: 0}

.sec11 { width: 100%; position: relative; overflow: hidden; }
.sec11 .layout {width: 100%; position: relative; padding-bottom: 30px;}
.sec11 .topWrap { width: 100%; position: relative; margin: 0 auto 0px; z-index: 1;}
.sec11 .topWrap a { position: absolute; width: 20%; height: 22%; top: 40%; left: 74%; display: block;}
.sec11 .swiper-container { width: 92%; position: relative; margin: 0 auto; z-index: 1;}
.sec11 .btnWrap { width: 90%; height: 1px; z-index: 10; position: absolute; top: 55%;  left: 5%;}
.sec11 .btnWrap img { cursor: pointer; width: 10%;}
.sec11 .btnWrap img:last-child { position: absolute; top: 0; right: 0;}
.sec11 li a { width: 100%; display: block; position: relative; padding-top: 40px; background: #fff;}
.sec11 li .imgWrap { width: 100%; padding: 50%; position: relative; overflow: hidden; margin-bottom: 20px; display: block;}
.sec11 li .imgWrap img { width: 100%; display: block; position: absolute; top: 0; left: 0;}
.sec11 li .type { width: 100%; height: 30px; display: block; position: absolute; top: 0; left: 0; overflow: hidden;  text-indent: -1000px;}
.sec11 li .type.t1::after { width: 156px; height: 30px; display: block; position: absolute; top: 0; left: 0; background: url("/final/assets/images/main/sec11_sns1.png") no-repeat top left; content: ""; background-size: contain;}
.sec11 li .type.t2::after { width: 156px; height: 30px; display: block; position: absolute; top: 0; left: 0; background: url("/final/assets/images/main/sec11_sns2.png") no-repeat top left; content: ""; background-size: contain; }
.sec11 li .type.t3::after { width: 156px; height: 30px; display: block; position: absolute; top: 0; left: 0; background: url("/final/assets/images/main/sec11_sns3.png") no-repeat top left; content: ""; background-size: contain; }
.sec11 li .tit { width: 100%; position: relative; overflow: hidden;  display: block; font-size: 20px; line-height: 1.4; height: 80px; font-weight: 800; color: #084951; letter-spacing: -1px;}
.sec11 li .date { width: 100%; position: relative; overflow: hidden; font-size: 14px; display: none;}

.sec12 { width: 100%; position: relative; overflow: hidden; }
.sec12 .layout {width: 100%; position: relative; padding-bottom: 30px;}
.sec12 .topWrap { width: 100%; position: relative; margin: 0 auto 0px; z-index: 1;}
.sec12 .topWrap a { position: absolute; width: 20%; height: 22%; top: 40%; left: 74%; display: block;}
.sec12 .btnWrap { width: 96%; height: 1px; z-index: 10; position: absolute; top: 27%;  left: 2%;}
.sec12 .btnWrap img { cursor: pointer; width: 7%;}
.sec12 .btnWrap img:last-child { position: absolute; top: 0; right: 0;}
.sec12 .swiper-container { width: 92%; position: relative; margin: 0 auto; z-index: 1;}
.sec12 li a { width: 100%; display: block; position: relative; background: #fff;}
.sec12 li .imgBox { width: 100%; height: 300px; padding-top: 70%;  position: relative; overflow: hidden; margin-bottom: 20px; display: block; border-radius: 30px;}
.sec12 li .imgBox img { width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0;}
.sec12 li .media { width: 100%; height: 30px; display: block; position: relative; overflow: hidden; margin-bottom: 0px; font-size: 20px; line-height: 1; color: #9c760f; letter-spacing: -1px; font-weight: 800;}
.sec12 li .tit { width: 100%; position: relative; overflow: hidden;  display: block; font-size: 20px; line-height: 1.4; height: 80px; font-weight: 800; color: #084951; letter-spacing: -1px;}


.sec13 { width: 100%;  position:relative;   overflow: hidden; background: #fff; padding-bottom: 10%;}
.sec13 .view { display: block; margin-left: 4%; margin-bottom: 4%; width: 20.5%; max-width: 148px;}
.sec13 .btnWrap { width:20%; height: 1px; position: absolute; top: 102%; left: 40%; z-index: 10;}
.sec13 .btnWrap img { width: 25%; max-width: 30px; cursor: pointer;}
.sec13 .btnWrap .next { position: absolute; top: 0; right: 0;}
.sec13 .swiper-container { margin-left: 4%; margin-right: 6%; width: 92%; overflow: hidden; margin-bottom: 2%;} 
.sec13 .swiper-pagination-fraction { bottom: calc(-6%); font-size: 16px; font-weight: 800;}
.sec13 .swiper-pagination-progressbar { width: 92%; height: 4px; position: relative; margin-left: 4%;}
.sec13 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{ background: #a97700;}
.sec13 .swiper-slide::after{ width: 100%; height: 8%; display: flex; align-items: center; justify-content: center; position: absolute; bottom: 5%; left: calc(-3%); z-index: 2;  background: url("../images/main/sec3_txt.png") no-repeat bottom right; background-size: contain; content: "";}
.sec13 .swiper-slide.txt2::after { background-image: url("../images/main/sec3_txt2.png")}
.sec13 .swiper-slide.txt3::after { background-image: url("../images/main/sec3_txt3.png")}
.sec13 .swiper-slide.txt4::after { background-image: url("../images/main/sec3_txt4.png"); left: 10%}
.sec13 .swiper-slide.txt5::after { background-image: url("../images/main/sec3_txt5.png")}
.sec13 .tLine { width: 100%; height: 12%; display: flex; align-items: center; justify-content: center; position: absolute; bottom: 2%; left: 0; z-index: 2; border-radius: 0 0 3vh 3vh;}
.sec13 .tLine img { width: 50%; display: block;}

.sec14 { width: 100%;  position:relative;   overflow: hidden; background: #fff;}


.sec3 { width: 100%;  position:relative;   overflow: hidden; background: #fff; padding-bottom: 10%;}
.sec3 .view { display: block; margin-left: 4%; margin-bottom: 4%; width: 20.5%; max-width: 148px;}
.sec3 .btnWrap { width:20%; height: 1px; position: absolute; top: 102%; left: 40%; z-index: 10;}
.sec3 .btnWrap img { width: 25%; max-width: 30px; cursor: pointer;}
.sec3 .btnWrap .next { position: absolute; top: 0; right: 0;}
.sec3 .swiper-container { margin-left: 4%; margin-right: 6%; width: 92%; overflow: hidden; margin-bottom: 2%;} 
.sec3 .swiper-pagination-fraction { bottom: calc(-6%); font-size: 16px; font-weight: 800;}
.sec3 .swiper-pagination-progressbar { width: 92%; height: 4px; position: relative; margin-left: 4%;}
.sec3 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{ background: #a97700;}
.sec3 .swiper-slide::after{ width: 100%; height: 8%; display: flex; align-items: center; justify-content: center; position: absolute; bottom: 5%; left: calc(-3%); z-index: 2;  background: url("../images/main/sec3_txt.png") no-repeat bottom right; background-size: contain; content: "";}
.sec3 .swiper-slide.txt2::after { background-image: url("../images/main/sec3_txt2.png")}
.sec3 .swiper-slide.txt3::after { background-image: url("../images/main/sec3_txt3.png")}
.sec3 .swiper-slide.txt4::after { background-image: url("../images/main/sec3_txt4.png"); left: 10%}
.sec3 .swiper-slide.txt5::after { background-image: url("../images/main/sec3_txt5.png")}
.sec3 .tLine { width: 100%; height: 12%; display: flex; align-items: center; justify-content: center; position: absolute; bottom: 2%; left: 0; z-index: 2; border-radius: 0 0 3vh 3vh;}
.sec3 .tLine img { width: 50%; display: block;}

.sec5 { width: 100%;  position:relative;   overflow: hidden;}
.sec5 .swiper-slide { background: #171a25;}
.sec5 .textWrap { width: 100%; position: absolute; top: 41%; left: 0}
.sec5 .nth1 { width: 100%; position: absolute; bottom: 0; left: 0}
.sec5 .view { display: block; width: 100%; height: 8%; position: absolute; top: 87%; left: 0%; z-index: 1;}
.sec5 .btnWrap { width:80%;  position: relative; margin: 0 auto; margin-top: 20px; padding-bottom: 20px; }
.sec5 .btnWrap img { width: 25%; max-width: 30px; cursor: pointer;}
.sec5 .btnWrap .next { position: absolute; top: 0; right: 0;}
.sec5 .swiper-pagination { width: 100%;  position: relative; text-align: center; top: -40px; z-index: 1;}
.sec5 .swiper-pagination-bullet { width: 12px;  height: 12px; margin: 0 3px;}
.sec5 .swiper-pagination-bullet-active {background: #a97700;}

.sec9 { width: 100%;  position:relative;   overflow: hidden;}
.sec9 .swiper-slide { background: #fff;}
.sec9 .linkWrap{ width: 100%;  position:relative;   overflow: hidden; background: #efefef; padding: 30px 1%;}
.sec9 .linkWrap div { width: 506%; position: relative; left: 0; transition: all .3s;}
.sec9 .linkWrap div.t4,
.sec9 .linkWrap div.t5,
.sec9 .linkWrap div.t6,
.sec9 .linkWrap div.t7 { left: calc(-101%);}
.sec9 .linkWrap div.t8,
.sec9 .linkWrap div.t9,
.sec9 .linkWrap div.t10,
.sec9 .linkWrap div.t11 { left: calc(-202%);}
.sec9 .linkWrap div.t12,
.sec9 .linkWrap div.t13,
.sec9 .linkWrap div.t14,
.sec9 .linkWrap div.t15 { left: calc(-303%);}
.sec9 .linkWrap div.t16,
.sec9 .linkWrap div.t17,
.sec9 .linkWrap div.t18,
.sec9 .linkWrap div.t19 { left: calc(-404%);}
.sec9 .linkWrap div::after { width: 1px; height: 0; clear: both; content: "";}
.sec9 .linkWrap a { display: block; float: left;  transform: scale(1); transition: all .5s; border-radius: 10px; width: 4.9%; margin-right: 0.1%; overflow: hidden;}
.sec9 .linkWrap a:hover { transform: scale(1.05);}
.sec9 .linkWrap a::after { width: 100%; height: 100%; border: 3px solid #9c760f; position: absolute; top: 0; left: 0; content: ''; box-sizing: border-box; border-radius: 10px; opacity: 1; transition: all .3s;}
.sec9 .linkWrap a.on::after,
.sec9 .linkWrap a:hover::after{ opacity: 1; border: 3px solid #fff;}
.sec9 .btnWrap{ display: block; position: absolute; top: 60%; left: 0%; width: 100%;  z-index: 5}
.sec9 .btnWrap img { width: 30%; max-width: 30px; cursor: pointer;}
.sec9 .btnWrap .next { position: absolute; top: 0; right: 0;}
.sec9 .tLine { width: 100%; height: 8%; display: flex; align-items: center; justify-content: center; position: absolute; bottom: 5%; left: calc(-3%); z-index: 2;  background: url("../images/main/sec3_txt.png") no-repeat bottom right; background-size: contain; content: "";}
.sec9 .tLine img { width: 50%; display: block;}
.sec9 .swiper-slide::after{ width: 100%; height: 5.4%; display: flex; align-items: center; justify-content: center; position: absolute; bottom: 2%; left: calc(-3%); z-index: 2;  background: url("../images/main/sec3_txt.png") no-repeat bottom right; background-size: contain; content: "";}
.sec9 .swiper-slide.txt2::after { background-image: url("../images/main/sec3_txt2.png"); left: calc(-3%);}
.sec9 .swiper-slide.txt3::after { background-image: url("../images/main/sec3_txt3.png")}
.sec9 .swiper-slide.txt4::after { background-image: url("../images/main/sec3_txt4.png")}

.sec6 { width: 100%;  position:relative;   overflow: hidden;}
.sec6 .linkWrap{ width: 100%;  position:relative;   overflow: hidden; background: #efefef; padding: 30px 1%; display: flex;  align-items: center;  justify-content: space-between; }
.sec6 .linkWrap a { display: flex; position: relative; transform: scale(1); transition: all .5s; border-radius: 10px; overflow: hidden;}
.sec6 .linkWrap a:hover { transform: scale(1.05);}
.sec6 .linkWrap a::after { width: 100%; height: 100%; border: 3px solid #9c760f; position: absolute; top: 0; left: 0; content: ''; box-sizing: border-box; border-radius: 10px; opacity: 1; transition: all .3s;}
.sec6 .linkWrap a.on::after,
.sec6 .linkWrap a:hover::after{ opacity: 1; border: 3px solid #fff;}
.sec6 .btnWrap{ display: block; position: absolute; top: 60%; left: 0%; width: 100%;  z-index: 5}
.sec6 .btnWrap img { width: 30%; max-width: 30px; cursor: pointer;}
.sec6 .btnWrap .next { position: absolute; top: 0; right: 0;}
.sec6 .tLine { width: 100%; height: 8%; display: flex; align-items: center; justify-content: center; position: absolute; bottom: 5%; left: calc(-3%); z-index: 2;  background: url("../images/main/sec3_txt.png") no-repeat bottom right; background-size: contain; content: "";}
.sec6 .tLine img { width: 50%; display: block;}
.sec6 .swiper-slide { background: #fff;}
.sec6 .swiper-slide::after{ width: 100%; height: 4.5%; display: flex; align-items: center; justify-content: center; position: absolute; bottom: 2%; left: calc(-3%); z-index: 2;  background: url("../images/main/sec3_txt.png") no-repeat bottom right; background-size: contain; content: "";}
.sec6 .swiper-slide.txt2::after { background-image: url("../images/main/sec3_txt2.png"); left: calc(-3%);}
.sec6 .swiper-slide.txt3::after { background-image: url("../images/main/sec3_txt3.png")}
.sec6 .swiper-slide.txt4::after { background-image: url("../images/main/sec3_txt4.png")}


.sec4_5 { width: 100%;  position:relative;   overflow: hidden; background: #eee9dd; padding-bottom: 50px;}
.sec4_5 .ifWrap { width: 92%; position: relative; margin: 0 auto 20px; }
.sec4_5 .ifBox { width: 100%; padding-top: 60%; position: relative; margin-bottom: 20px;}
.sec4_5 .ifTit { width: 100%; font-size: 20px; line-height: 1; color: #084951; text-align: center;font-weight: 800;}
.sec4_5 .swiperWrap { width: 100%; position: relative;  background: #eee9dd; padding: 20px 4%; }
.sec4_5 .swiper-slide { border-radius: 10px; position: relative; overflow: hidden; }
.sec4_5 .swiper-slide a { width: 100%; display: block; position: relative; overflow: hidden; border-radius: 10px; margin-bottom: 10px;  }
.sec4_5 .swiper-slide.on a{border-color: #0E4A52;}
.sec4_5 .swiper-pagination-progressbar { width: 92%; height: 5px; margin: 0 auto; position: relative;}
.sec4_5 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{ background: #a97700;}

.sec4_2 { width: 100%;  position:relative;   overflow: hidden; background: #fff; padding-bottom: 50px;}
.sec4_2 .ifWrap { width: 92%; position: relative; margin: 0 auto 20px; }
.sec4_2 .ifBox { width: 100%; padding-top: 60%; position: relative; margin-bottom: 20px;}
.sec4_2 .ifTit { width: 100%; font-size: 20px; line-height: 1; color: #084951; text-align: center;font-weight: 800;}
.sec4_2 .swiperWrap { width: 100%; position: relative;  background: #eee9dd; padding: 30px 3%; margin-bottom: 15px;}
.sec4_2 .swiper-slide { border-radius: 10px; position: relative; overflow: hidden; border: 3px solid #fff;   }
.sec4_2 .swiper-slide.on {border-color: #0E4A52;}
.sec4_2 .swiper-pagination-progressbar { width: 92%; height: 5px; margin: 0 auto; position: relative;}
.sec4_2 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{ background: #a97700;}

.sec4_3 { width: 100%;  position:relative;   overflow: hidden; background: #eee9dd; padding-bottom: 50px;}
.sec4_3 .ifWrap { width: 92%; position: relative; margin: 0 auto 20px; }
.sec4_3 .ifBox { width: 100%; padding-top: 60%; position: relative; margin-bottom: 20px;}
.sec4_3 .ifTit { width: 100%; font-size: 20px; line-height: 1; color: #084951; text-align: center;font-weight: 800;}
.sec4_3 .swiperWrap { width: 100%; position: relative;  background: #eee9dd; padding: 30px 3%; margin-bottom: 15px;}
.sec4_3 .swiper-slide { border-radius: 10px; position: relative; overflow: hidden; border: 3px solid #fff;   }
.sec4_3 .swiper-slide.on {border-color: #0E4A52;}
.sec4_3 .swiper-pagination-progressbar { width: 92%; height: 5px; margin: 0 auto; position: relative;}
.sec4_3 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{ background: #a97700;}

.sec4 { width: 100%;  position:relative;   overflow: hidden; background: #fff; padding-bottom: 50px;}
.sec4 .ifWrap { width: 92%; position: relative; margin: 0 auto 20px; }
.sec4 .ifBox { width: 100%; padding-top: 60%; position: relative; margin-bottom: 20px;}
.sec4 .ifTit { width: 100%; font-size: 20px; line-height: 1; color: #084951; text-align: center;font-weight: 800;}
.sec4 .swiperWrap { width: 100%; position: relative;  background: #eee9dd; padding: 30px 3%; margin-bottom: 15px;}
.sec4 .swiper-slide { border-radius: 10px; position: relative; overflow: hidden; border: 3px solid #fff;}
.sec4 .swiper-slide.on {border-color: #0E4A52;}
.sec4 .swiper-pagination-progressbar { width: 92%; height: 5px; margin: 0 auto; position: relative;}
.sec4 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{ background: #a97700;}

.sec7 { width: 100%;  position:relative;   overflow: hidden;}
.sec7 .nb1 { width: 100%; position: relative;}
.sec7 .nb1 a { width: 22%; height: 50%; position: absolute; top: 0; }
.sec7 .nb1 a.btn1 { left: 10%;}
.sec7 .nb1 a.btn2 { left: 39%;}
.sec7 .nb1 a.btn3 { left: 68%;}
.sec7 .nb1 a.btn4 { left: 10%; top: 50%;}
.sec7 .nb1 a.btn5 { left: 39%; top: 50%;}
.sec7 .nb1 a.btn6 { left: 68%; top: 50%;}
.sec7 .nb2 { width: 100%; position: relative;}
.sec7 .nb2 a { width: 50%; height: 53%; position: absolute; top: 0; }
.sec7 .nb2 a.btn1 { left: 0%;}
.sec7 .nb2 a.btn2 { left: 50%;}


.popupWrap { position:fixed;    top: 100%;    left:0;   background-color:rgba(0, 0, 0, 0.4);    display:flex;    flex-flow:row wrap;    align-items: center;    justify-content: center;    z-index: 10000;    width: 100%;    height: 100%; transition: all 1s;}
.pon .popupWrap { top: 0; }
.popupWrap .swiper-container {  width: 80%;   max-wwidth: 500px;    }
.popupWrap .contWrap img {    width: 100%;	display: block;}
.popupWrap .btnsWrap {    width: 100%;    height: 41px;    position:relative;    cursor: pointer;    background-color:#9B7511;	z-index: 9;}
.popupWrap .btnsWrap p {    color: #fff;    font-size: 16px;    font-family: 'NotoKrR';    position: absolute;    top: 12px;    left: 10px;	}
.popupWrap .btnsWrap span {    position:absolute;    display:block;    width: 40px;    height: 40px;    bottom: 0;    right: -15px;    transition:all .3s;}
.popupWrap .btnsWrap span::after { width:  100%; height: 100%; font-size: 20px; line-height: 40px; z-index: 1; content: "X"; text-align: center; color: #fff;}
.popupWrap a { display: block; position: relative;}	.popupWrap .swiper-slide>a { text-indent: 0;}
	.popupWrap .arrows {  position:absolute;   top:50%;    width: 30px;    display:block;    margin-top:-27px; z-index: 100;}
	.popupWrap .arrows img { width: 100%;}
	.popupWrap .arrows.left {   left:10px;	text-indent: 0px;}
	.popupWrap .arrows.right {    right:10px;	text-indent: 0px;}

.cusBtn {
    display: none;
}

.header .topWrap .telBtn {
    margin-right: 0;
}