@charset "utf-8";

/*-------------------------------------------------------------------
	@ Variables
-------------------------------------------------------------------*/
:root{
	--color-primary: #f04137;
}

/*-------------------------------------------------------------------
	@ Layout
-------------------------------------------------------------------*/

body{background: #f9f9f9;}

#wrap{overflow: hidden;}

/* header */
header{position: fixed; left: 0; top: 0; width: 100%; padding: 3rem 0; background: #f9f9f9; z-index: 1100;}
header > div{position: relative; width: 1480px; margin: 0 auto;}
header h1 a{display: block; width: 15.0rem; height: 3.9rem; background: url('../images/common/logo.svg') center / 100% auto no-repeat; text-indent: -9999em;}
header .nav{display: flex; position: absolute; left: 20.6rem; top: 0.2rem; transform: translateX(0); transition: all 0.7s ease; white-space: nowrap;}
header .nav li{margin-left: 3rem;}
header .nav li:first-child{margin-left: 0;}
header .nav li a{display: block; font-weight: 500; font-size: 1.8rem; line-height: 3.5rem; color: #444;}
header .nav li a:hover,
header .nav li a.on{font-weight: 800; color: #002755;}
header .nav li a.btn-buy{padding: 0 4.2rem 0 1.5rem; border-radius: 0.5rem; background: url('../images/common/ico_cart.png') right 1.5rem center / 2.2rem auto no-repeat #00ADEF; color: #fff;}
header .prd-menu{display: none; position: absolute; right: 5.5rem; top: 0;}
header .prd-menu ul{display: flex;}
header .prd-menu ul li{margin-left: 3rem;}
header .prd-menu ul li:first-child{margin-left: 0;}
header .prd-menu ul li a{display: block; font-weight: 600; font-size: 1.6rem; line-height: 4rem; color: #444;}
header .prd-menu ul li a:hover,
header .prd-menu ul li a.on{font-weight: 800; color: #7B57C4;}
header .prd-menu ul li a.btn-usage{font-weight: 700;}
header .btn-menu{position: absolute; right: -1rem; top: 0; width: 4rem; height: 4rem; background: url('../images/common/ico_menu.svg') center / 2rem auto no-repeat; text-indent: -9999em;}
header .all-menu{display: none; position: absolute; left: 0; top: 10rem; width: 100%; height: calc(100vh - 10rem); padding: 4rem 0; background: #fff; box-sizing: border-box; overflow-y: auto;}
header .all-menu ul.menu{width: 148rem; margin: 0 auto;}
header .all-menu ul.menu > li{display: flex; position: relative; padding: 4rem 0;}
header .all-menu ul.menu > li::after{position: absolute; right: 0; top: 0; width: 129rem; height: 0.1rem; background: #DFDFDF; content: "";}
header .all-menu ul.menu > li:first-child::after{display: none;}
header .all-menu ul.menu > li > .depth1{display: block; width: 19rem; color: #333; font-size: 2.4rem; font-weight: 700; line-height: 2.4rem;}
header .all-menu ul.menu > li > .depth2{display: flex; width: 129rem;}
header .all-menu ul.menu > li > .depth2 > li{min-width: 21.5rem; padding: 0 1rem; box-sizing: border-box;}
header .all-menu ul.menu > li > .depth2 > li > a{display: inline-block; font-size: 1.8rem; font-weight: 700; line-height: 2.4rem;}
header .all-menu ul.menu > li > .depth2 > li > .depth3{margin-top: 1.7rem;}
header .all-menu ul.menu > li > .depth2 > li > .depth3 li{margin-top: 1rem;}
header .all-menu ul.menu > li > .depth2 > li > .depth3 li a{display: block; color: #333; font-size: 1.4rem; line-height: 150%;}
header .all-menu ul.menu > li > .depth2 > li > .depth3 li a:hover{text-decoration: underline; text-underline-position: under;}
header .all-menu ul.menu > li > .depth2 > li.w-size2{min-width: 26.4rem;}
header .all-menu ul.menu > li.menu1 > .depth2 > li > a{color: #002755;}
header .all-menu ul.menu > li.menu2 > .depth2 > li > a{color: #7B57C4;}
header .all-menu ul.menu > li.menu3 > .depth2 > li > a{color: #008A1A;}
header .all-menu ul.menu > li.menu4 > .depth2 > li > a{color: #247DE3;}
header .all-menu ul.menu > li.menu5 > .depth2 > li > a{color: #00BBB6;}
header.menu-open{background: #012756 !important;}
header.menu-open h1 a{background-image: url('../images/common/logo_w.svg');}
header.menu-open .nav{display: none;}
header.menu-open .prd-menu{display: none !important;}
header.menu-open .btn-menu{background-image: url('../images/common/ico_menu_close.svg');}
header.menu-open .all-menu{display: block;}
header.prd-open .prd-menu{display: block;}
body.page-main header{position: absolute; background: none;}
body.intro header .nav{left: auto; left: calc(100% - 5rem); transform: translateX(-100%);}
body.intro header .prd-menu{display: none;}

/* main */
main{position: relative; padding-top: 10rem;}
body.page-main main{padding-top: 0;}

/* footer */
footer{padding: 4rem 0; text-align: center;}
footer .tel{display: inline-flex; align-items: center;}
footer .tel span{display: block; padding-left: 2.2rem; background: url('../images/common/ico_tel.svg') left center no-repeat; font-size: 1.3rem; line-height: 2.2rem; color: #444;}
footer .tel strong{display: block; margin-left: 1.4rem; font-weight: 700; font-size: 2.2rem; line-height: 100%; color: #334FA1;}
footer .menu{margin-top: 2.5rem;}
footer .menu ul{display: inline-flex; gap: 2rem;}
footer .menu li a{display: block; font-weight: 500; font-size: 1.3rem; color: #00ADEF;}
footer .info{display: inline-block; width: auto; margin-top: 2rem;}
footer .info::after{content: ""; display: block; clear: both;}
footer .info li{float: left; position: relative; padding-left: 0.8rem; margin-left: 0.8rem; font-size: 1.2rem; line-height: 100%; color: #444;}
footer .info li::after{position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 0.1rem; height: 1rem; background: #888; content: "";}
footer .info li:first-child{padding-left: 0; margin-left: 0;}
footer .info li:first-child::after{display: none;}
footer .copy{margin-top: 0.6rem; font-size: 1.2rem; line-height: 100%; color: #444;}
body.intro footer{text-align: left;}
body.intro footer .info li{margin-top: 0.5rem;}
body.intro footer .info li:first-child{margin-top: 0;}
body.intro footer .info li.block{clear: both; padding-left: 0; margin-left: 0;}
body.intro footer .info li.block::after{display: none;}
body.intro footer .copy{margin-top: 0;}

/*-------------------------------------------------------------------
	@ Componets
-------------------------------------------------------------------*/
/* button */
.btn-wrap > div{position: relative;}
.btn-wrap > div > div:last-child{position: absolute; right: 0; top: 0;}
.btn-wrap a + a{margin-left: 3rem;}
.btn-large{display: inline-flex; padding: 0 2rem; border-radius: 0.5rem; font-size: 1.4rem; color: #fff; font-weight: 700; line-height: 4rem; box-sizing: border-box; cursor: pointer;}
.btn-primary{display: inline-flex; align-items: center; height: 7.2rem; padding: 0 4rem; background: #01AEF0; color: #FFF; font-size: 2rem; font-weight: 600; color: #fff;}
.btn-primary.arw-r{padding-right: 6.8rem; background: url('../images/common/ico_btn_arw_r.png') right 4rem center no-repeat #01AEF0;}
.btn-secondary{display: inline-flex; align-items: center; justify-content: center; min-width: 23rem; height: 7.2rem; background: #001F5B; color: #FFF; font-size: 2rem; font-weight: 600; color: #fff; box-sizing: border-box;}
.btn-secondary.outline{border: 0.1rem solid #001F5B; background: #fff; color: #001F5B;}
.btn-down{display: inline-flex; align-items: center; height: 50px; padding:0 64px 0 30px; border: 1px solid #001F5B; background: url('../images/common/ico_down.svg') right 30px center no-repeat; color: #001F5B; font-size: 18px; font-weight: 600; line-height: 160%; box-sizing: border-box;}


/* bullet */
.bul.space > li{margin-top: 1.5rem;}
.bul.space > li:first-child{margin-top: 0;}
.bul.dot > li{position: relative; padding-left: 1rem;}
.bul.dot > li::before{position: absolute; top: 0; left: 0; content: "\00B7";}
.bul.dash > li{position: relative; padding-left: 1rem;}
.bul.dash > li::before{position: absolute; top: 0; left: 0; content: "\002D"; vertical-align: middle;}
.bul.num > li{position: relative; padding-left: 1.6rem; text-indent: -1.6rem;}

/* dim */
.dim{display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(237, 64, 67, 0.9);}
.dim.all{z-index: 10000;}
.dim.page{z-index: 8000;}
.dim.on{display: block;}

/* board */
.board-list{width: 100%; border-top: 0.2rem solid #3e3a39;}
.board-list > li{display: flex; padding: 2.5rem 0; border-bottom: 0.1rem solid #cfcfcf;}
.board-list > li .no{width: 10rem; color: #000; font-size: 1.8rem; font-weight: 600; line-height: 100%; text-align: center;}
.board-list > li .tit{flex: 1; padding-left: 4rem; color: #000; font-size: 1.8rem; font-weight: 600; line-height: 100%; text-align: left;}
.board-list > li .date{padding: 0 6rem 0 4rem; color: #000; font-size: 1.8rem; font-weight: 400; line-height: 100%; text-align: center;}
.board-gallery{display: flex; flex-wrap: wrap; gap: 5rem 30px; width: 100%; margin: 0 auto;}
.board-gallery > li{width: 350px;}
.board-gallery > li a{display: block;}
.board-gallery > li .img{position: relative; width: 100%; height: 24rem; border-radius: 3rem; overflow: hidden;}
.board-gallery > li .img.play::after{position:absolute; left: 0; top: 0; width: 100%; height: 100%; background: url('../images/common/ico_play.svg') center no-repeat; content: "";}
.board-gallery > li .img img{width: 100%; height: 100%; object-fit: cover;}
.board-gallery > li strong{display: block; width: 100%; margin-top: 2.4rem; color: #001F5B; font-size: 2.4rem; font-weight: 700; line-height: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.board-gallery > li p{margin-top: 1.5rem; color: #000; font-size: 1.8rem; font-weight: 400; line-height: 160%; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;}
.board-view{width: 100%; margin: 0 auto;}
.board-view .head{display: flex; justify-content: space-between; align-items: center; padding: 2.5rem 5rem; border-top: 0.2rem solid #3e3a39;}
.board-view .head h3{display: block; color: #333; font-size: 2rem; font-weight: 700; line-height: 140%;}
.board-view .head .date{color: #000; font-size: 1.6rem; font-weight: 400; line-height: 100%;}
.board-view .cont{padding: 5rem 5rem 8rem; border-top: 0.1rem solid #CFCFCF; color: #000; font-size: 1.6rem; font-weight: 400; line-height: 180%;}
.board-view .cont img{max-width: 100%;}
.board-view .cont iframe{width: 100%; height: auto; aspect-ratio: 560 / 315;}
.board-view .btn-wrap{margin-top: 6rem; text-align: center;}
.board-entry ul{border-top: 0.1rem solid #3E3A39;}
.board-entry ul li{display: flex; align-items: center; height: 7rem; border-bottom: 0.1rem solid #CFCFCF;}
.board-entry ul li .label{display: block; position: relative; width: 15rem; padding-left: 3.8rem; margin-right: 2.5rem; color: #000; font-size: 1.6rem; font-weight: 700; line-height: 100%; box-sizing: border-box;}
.board-entry ul li .label::after{position: absolute; right: -1rem; top: 50%; width: 0.1rem; height: 1.8rem; margin-top: -0.9rem; background: #000; content: "";}
.board-entry ul li .label.prev{background: url('../images/common/ico_post_prev.svg') left 10rem center no-repeat;}
.board-entry ul li .label.next{background: url('../images/common/ico_post_next.svg') left 10rem center no-repeat;}
.board-entry ul li .tit{display: block; color: #000; font-size: 1.6rem; font-weight: 500; line-height: 100%;}
.board-entry ul li .date{display: block; width: 15rem; margin-left: auto; color: #000; font-size: 1.6rem; font-weight: 400; line-height: 100%; text-align: center;}
.pagination{margin-top: 5rem; text-align: center;}
.pagination ul{display: inline-flex;}
.pagination ul li .page-num{display: flex; align-items: center; justify-content: center; width: 4rem; height: 4rem; border-radius: 100%; color: #666; font-size: 1.6rem; font-weight: 400; letter-spacing: 0.03rem;}
.pagination ul li .page-num.active{margin: 0 1rem; background: #001F5B; color: #fff; font-weight: 700;}
.pagination ul li .page-prev{display: flex; align-items: center; justify-content: center; width: 4rem; height: 4rem; background: url('../images/common/ico_page_prev.svg') center no-repeat; text-indent: -9999em;}
.pagination ul li .page-next{display: flex; align-items: center; justify-content: center; width: 4rem; height: 4rem; background: url('../images/common/ico_page_next.svg') center no-repeat; text-indent: -9999em;}

/* form */
.form-wrap{border-top: 0.2rem solid #3e3a39;}
.form-wrap .form-group{display: flex; align-items: center; width: 100%; padding: 1.5rem 0; border-bottom: 0.1rem solid #cfcfcf; color: #333; font-size: 1.8rem; font-weight: 500;}
.form-wrap .form-group > label{align-self: flex-start; width: 20rem; padding-left: 4rem; color: #000; font-size: 1.8rem; font-weight: 600; line-height: 5rem; box-sizing: border-box;}
.form-wrap .form-group.spacebet{justify-content: space-between;}
.form-wrap .form-group.spacebet > label{width: 50rem;}
.form-wrap .form-group input[type=email],
.form-wrap .form-group input[type=tel],
.form-wrap .form-group input[type=text]{flex: 1; height: 5rem; padding: 0 3rem; border: 0.1rem solid #cfcfcf; border-radius: 0; font-size: 1.8rem; line-height: 100%; font-weight: 500; color: #333; box-sizing: border-box;}
.form-wrap .form-group input[type=text]::placeholder{color: #C2C2C2; font-weight: 400;}
.form-wrap .form-group input[type="checkbox"]{display: block; position: absolute; overflow: hidden; height: 0.1rem; border: 0; width: 0.1rem; clip: rect(0.1rem, 0.1rem, 0.1rem, 0.1rem);}
.form-wrap .form-group input[type="checkbox"] + label{display: inline-block; position: relative; padding-left: 4rem; margin-right: 5rem; cursor: pointer; color: #333; font-size: 1.8rem; font-weight: 500; line-height: 3rem;}
.form-wrap .form-group input[type="checkbox"] + label:before{position: absolute; top: 0; left: 0; width: 3rem; height: 3rem; background: url('../images/common/checkbox.svg') center / 100% auto no-repeat; cursor: pointer; box-sizing: border-box; content: "";}
.form-wrap .form-group input[type="checkbox"]:checked + label:before{background-image: url('../images/common/checkbox_on.svg');}
.form-wrap .form-group input[type="radio"]{display: block; position: absolute; overflow: hidden; height: 0.1rem; border: 0; width: 0.1rem; clip: rect(0.1rem, 0.1rem, 0.1rem, 0.1rem);}
.form-wrap .form-group input[type="radio"] + label{display: inline-block; position: relative; padding-left: 4rem; margin-right: 5rem; cursor: pointer; color: #333; font-size: 1.8rem; font-weight: 500; line-height: 3rem;}
.form-wrap .form-group input[type="radio"] + label:before{position: absolute; top: 0; left: 0; width: 3rem; height: 3rem; background: url('../images/common/radio.svg') center / 100% auto no-repeat; cursor: pointer; box-sizing: border-box; content: "";}
.form-wrap .form-group input[type="radio"]:checked + label:before{background-image: url('../images/common/radio_on.svg');}
.form-wrap .form-group select{width: 50rem; height: 5rem; padding: 0 3rem; border: 0.1rem solid #cfcfcf; border-radius: 0; background: url('../images/common/ico_select.png') right 3rem center no-repeat; font-size: 1.8rem; line-height: 100%; font-weight: 500; color: #333; box-sizing: border-box;}
.form-wrap .form-group textarea{flex: 1; height: 18rem; padding: 1.6rem 3rem; border: 0.1rem solid #E0E0E0;  font-size: 1.8rem; line-height: 100%; font-weight: 500; color: #333; line-height: 150%; box-sizing: border-box;}
.form-wrap .form-group #phone1{flex: 0; width: 10rem; padding: 0; margin-right: 1rem; text-align: center;}
.form-wrap .form-group #phone2{flex: 0; width: 15rem; padding: 0; margin: 0 1rem; text-align: center;}
.form-wrap .form-group #phone3{flex: 0; width: 15rem; padding: 0; margin-left: 1rem; text-align: center;}
.form-wrap .form-group #email1{flex: 0; width: 31.5rem; margin-right: 1rem;}
.form-wrap .form-group #email2{flex: 0; width: 28rem; margin: 0 1rem;}
.form-wrap .form-group #emailDomainSelect{width: 27rem;}
.form-wrap .form-group #datepicker{flex: 0; width: 28.4rem;}
.form-wrap .form-group .btn-datepicker{width: 2.4rem; height: 2.4rem; margin-left: 1rem; background: url('../images/common/ico_cal.svg') center / 100% auto no-repeat; text-indent: -9999em;}
.form-wrap .form-group #time{margin-left: 4rem; width: 27rem;}
.form-wrap .privacy-box{padding: 3rem 4rem; margin-bottom: 2.5rem; border: 0.1rem solid #E0E0E0; border-top: 0; color: #333; font-size: 1.6rem; font-weight: 500; line-height: 180%;}
.form-wrap .privacy-box + .form-group{border-top: 0.1rem solid #E0E0E0;}
.ui-datepicker{font-size: 1.6rem;}


/*-------------------------------------------------------------------
	@ Pages
-------------------------------------------------------------------*/
/* 메인 */
.main{position: relative; left: 50%; width: 2560px; margin-left: -1280px;}
.main .slide{position: absolute; left: -59.375%; top: 0; width: 59.375%; height: 100%; transition: all 0.7s ease; overflow: hidden;}
.main .slide .swiper-container{height: 100%; overflow: hidden;}
.main .slide .swiper-slide{position: relative; height: 100%;}
.main .slide .swiper-slide > div{position: relative; width: 980px; height: 100%;}
.main .slide .swiper-slide .info{position: absolute; left: 47px; top: 17.8rem;}
.main .slide .swiper-slide .info p{font-weight: 600; font-size: 2.2rem; line-height: 150%; color: #4D4D4D;}
.main .slide .swiper-slide .info .tit{display: block; margin-top: 2rem; font-weight: 800; font-size: 6rem; line-height: 100%; color: #002756; color: #4D4D4D;}
.main .slide .swiper-slide .info .tag{display: flex; margin-top: 3rem;}
.main .slide .swiper-slide .info .tag li{padding: 0 2rem; margin-left: 1rem; border-radius: 10rem; background: #B2DDF1; font-weight: 500; font-size: 1.6rem; line-height: 3.2rem;}
.main .slide .swiper-slide .info .tag li:first-child{margin-left: 0;}
.main .slide .swiper-slide .btn-link{display: block; position: absolute; left: 47px; top: 63.5rem; min-width: 15rem; padding: 0 4rem; border-radius: 0.8rem; background: #002756; font-weight: 700; font-size: 2rem; line-height: 100%; line-height: 6rem; color: #fff; box-sizing: border-box;}
.main .slide .swiper-slide.item1{display: flex; justify-content: flex-end; background: url('../images/main/slide1_bg.jpg') right top no-repeat #eeecf7;}
.main .slide .swiper-slide.item1 .info .tit{color: #7B57C4;}
.main .slide .swiper-slide.item1 .info .tag li{background: #BEC5D7;}
.main .slide .swiper-slide.item2{display: flex; justify-content: flex-end; background: url('../images/main/slide2_bg.jpg') right top no-repeat #ebf9f7;}
.main .slide .swiper-slide.item2 .info .tit{color: #00BBB6;}
.main .slide .swiper-slide.item2 .info .tag li{background: #BCCFD7;}
.main .slide .swiper-slide.item3{display: flex; justify-content: flex-end; background: url('../images/main/slide3_bg.jpg') right top no-repeat #d9f1fc;}
.main .slide .swiper-slide.item3 .info .tit{color: #002755;}
.main .slide .swiper-slide.item3 .info .tag li{background: #AEC9DB;}
.main .slide .control{position: absolute; right: -47px; top: 73.7rem; width: 980px; text-align: left; z-index: 10;}
.main .slide .control > div{display: inline-flex; align-items: center; justify-content: space-between; position: relative; min-width: 15rem;}
.main .slide .control .swiper-pagination-wrap{display: flex; align-items: center;}
.main .slide .control .swiper-pagination{position: relative; left: auto; top: auto; bottom: auto; width: auto; margin-right: 0.5rem;}
.main .slide .control .swiper-pagination .swiper-pagination-bullet{width: 0.8rem; height: 0.8rem; margin: 0; margin-left: 0.6rem; background: #002756; opacity: 0.2; transition: all 0.7s ease;}
.main .slide .control .swiper-pagination .swiper-pagination-bullet:nth-of-type(1){margin-left: 0;}
.main .slide .control .swiper-pagination .swiper-pagination-bullet-active{background: #002756; opacity: 1;}
.main .slide .control .swiper-button-play{width: 2rem; height: 2rem; background: url('../images/main/ico_pause.svg') center 0.5rem / 0.9rem auto no-repeat; text-indent: -9999em;}
.main .slide .control .swiper-button-play.on{background-image: url('../images/main/ico_play.svg')}
.main .slide .control .swiper-button-wrap{display: flex;}
.main .slide .control .swiper-button-prev{position: relative; left: auto; width: 3.1rem; height: 3.1rem; padding: 0; margin: 0; background: url('../images/main/btn_prev.png') center / 100% auto no-repeat;}
.main .slide .control .swiper-button-prev::after{display: none;}
.main .slide .control .swiper-button-next{position: relative; right: auto; width: 3.1rem; height: 3.1rem; padding: 0; margin: 0 0 0 0.8rem; background: url('../images/main/btn_next.png') center / 100% auto no-repeat;}
.main .slide .control .swiper-button-next::after{display: none;}
.main .content{position: relative; left: 0; width: 100%; min-height: 100vh; padding: 14rem 0 0 0; background: #F9F9F9; box-sizing: border-box; transition: all 0.8s ease;}
.main .content .prd-list{display: flex; flex-wrap: wrap; gap: 2rem; position: relative; left: calc(50% - 740px); width: 94rem; margin-bottom: 2rem; margin-top: 19rem; transition: left 0.5s ease; z-index: 10;}
.main .content .prd-list li{position: relative; width: 26rem; height: 26rem;}
.main .content .prd-list li a{display: block; width: 100%; height: 100%; padding: 3rem; border: 0.1rem solid #9C9C9C; border-radius: 2rem; box-sizing: border-box;}
.main .content .prd-list li a h3{display: block; font-weight: 700; font-size: 2.6rem; line-height: 100%; color: #002756;}
.main .content .prd-list li a p{margin-top: 2rem; font-size: 1.8rem; line-height: 150%; color: #444;}
.main .content .prd-list li.item1 a{background: url('../images/main/list_item1.svg') right 1.8rem bottom 3.1rem / 8rem auto no-repeat #fff;}
.main .content .prd-list li.item2 a{background: url('../images/main/list_item2.svg') right 1.5rem bottom 2.8rem / 8rem auto no-repeat #fff;}
.main .content .prd-list li.item3 a{background: url('../images/main/list_item3.svg') right 2rem bottom 3.1rem / 8rem auto no-repeat #fff;}
.main .content .prd-list li.item4 a{background: url('../images/main/list_item4.svg') right 2rem bottom 3.5rem / 8rem auto no-repeat #fff;}
.main .content .prd-list li.item5 a{background: url('../images/main/list_item5.svg') right 2rem bottom 4rem / 6rem auto no-repeat #fff;}
.main .content .prd-list li.item6 a{background: url('../images/main/list_item6.svg') right 2rem bottom 4.3rem / 7.6rem auto no-repeat #fff;}
.main .content .prd-list li.banner{display: none; width: 100%; height: 18rem; background: #fff;}
.main .content .prd-list li.banner a{position: relative; background: url('../images/main/list_banner.svg') center 3.5rem no-repeat; text-indent: -9999em; z-index: 10;}
.main .content .prd-list li.banner span{position: absolute; right: 2rem; top: 1.5rem; padding-right: 1rem; background: url('../images/main/ico_more.svg') right center no-repeat; font-size: 1.6rem; line-height: 150%; color: #444;}
.main .content .link-list{position: absolute; left: calc(50% + 34px); top: 33rem; width: 78.5rem; opacity: 1; transition: all 0.35s ease; z-index: 10;}
.main .content .link-list li{position: relative; width: 100%; height: 26rem;}
.main .content .link-list li + li{margin-top: 2rem;}
.main .content .link-list li a{display: block; width: 100%; height: 100%; padding: 3rem; border-radius: 2rem; box-sizing: border-box;}
.main .content .link-list li a h3{display: block; font-weight: 700; font-size: 2.6rem; line-height: 100%; color: #002756;}
.main .content .link-list li a p{margin-top: 2rem; font-size: 1.8rem; line-height: 150%; color: #444;}
.main .content .link-list li.item1 a{background: url('../images/main/link1_bg.jpg') right center / 62rem auto no-repeat #eee;}
.main .content .link-list li.item2 a{background: url('../images/main/link2_bg.jpg') right center / 62rem auto no-repeat #eee;}
.main .content footer{padding: 2rem 0; margin-top: 0;}
.main .side{position: absolute; left: 0; top: 10rem; width: 100%; text-align: center; opacity: 1; transition: opacity 1.0s 0.1s ease;}
.main .side > div{position: relative; width: 1480px; margin: 0 auto;}
.main .side .title{position: absolute; left: 0; top: 8rem; text-align: left;}
.main .side .title p{color: #4D4D4D; font-size: 2.2rem; font-weight: 600; line-height: 150%;}
.main .side .title strong{display: block; margin-top: 2rem; color: #002756; font-size: 6rem; font-weight: 800; line-height: 100%;}
.main .btn-switch{position: fixed; left: 0; top: 43.5rem; width: 8rem; height: 8rem; background: url('../images/main/ico_switch_right.png') center no-repeat #fff; text-indent: -9999em; z-index: 10; transition: all 0.7s ease;}
.main .ft-menu{display: none; position: fixed; left: 50%; bottom: 5rem; width: 47rem; margin-left: 323px; text-align: right; z-index: 100;}
.main .ft-menu.on{display: block;}
.main .ft-menu ul{display: inline-flex;}
.main .ft-menu ul li{width: 20.1rem; border-radius: 100%; box-shadow: 5px 5px 8px rgba(0, 0, 0, 0.25);}
.main .ft-menu ul li + li{margin-left: 1.2rem;}
.main .ft-menu ul li img{width: 100%;}
.main .ft-menu .btn-close{position: absolute; right: 0; top: -10px; width: 25px; height: 25px; background: url('../images/common/ico_close2.svg') no-repeat; text-indent: -9999em;}
body.intro .main .slide{left: 0;}
body.intro .main .content{left: 59.375%; width: 40.625%; padding-left: 9.2rem; padding-bottom: 3rem; transition: all 0.7s ease;}
body.intro .main .content .prd-list{left: 0; width: 47rem; margin-left: 0; margin-top: 0; margin-bottom: 1rem; transition: left 0s ease, margin-top 0.3s ease;}
body.intro .main .content .prd-list li{width: 22.5rem; height: 22.5rem;}
body.intro .main .content .prd-list li a{display: block; width: 100%; height: 100%; padding: 3rem; border: 0.1rem solid #9C9C9C; border-radius: 2rem; box-sizing: border-box;}
body.intro .main .content .prd-list li a h3{display: block; font-weight: 700; font-size: 2.4rem; line-height: 100%; color: #002756;}
body.intro .main .content .prd-list li a p{margin-top: 2rem; font-size: 1.6rem; line-height: 150%; color: #444;}
body.intro .main .content .prd-list li.item1 a{background: url('../images/main/list_item1.svg') right 3rem bottom 2.3rem no-repeat #fff;}
body.intro .main .content .prd-list li.item2 a{background: url('../images/main/list_item2.svg') right 2rem bottom 2.3rem no-repeat #fff;}
body.intro .main .content .prd-list li.item3 a{background: url('../images/main/list_item3.svg') right 3rem bottom 2.3rem no-repeat #fff;}
body.intro .main .content .prd-list li.item4 a{background: url('../images/main/list_item4.svg') right 2.5rem bottom 2.3rem no-repeat #fff;}
body.intro .main .content .prd-list li.item5,
body.intro .main .content .prd-list li.item6{display: none;}
body.intro .main .content .prd-list li.banner{display: block; width: 100%; height: 18rem;}
body.intro .main .content .link-list{left: 100%; opacity: 0; transition: all 0.7s ease;}
body.intro .main .content footer{margin-top: 0;}
body.intro .main .btn-switch{position: absolute; left: calc(59.375% - 8rem); background-image: url('../images/main/ico_switch_left.png');}
body.intro .main .side{opacity: 0; transition: opacity 0.3s ease;}

/* 서브공통 */
.sub{margin-bottom: 2rem;}
.sub .visual{height: 50rem; box-sizing: border-box;}
.sub .visual > div{width: 1200px; margin: 0 auto;}
.sub .visual h2{display: block; padding-top: 20rem; color: #002756; font-size: 5.5rem; font-weight: 800; line-height: 100%;}
.sub .visual .top{display: flex; align-items: center;}
.sub .visual .top h3{display: block; color: #7B57C4; font-size: 5.5rem; font-weight: 800; line-height: 100%;}
.sub .visual .top a,
.sub .visual .top button{display: inline-flex; align-items: center; height: 4.5rem; padding: 0 2rem; margin-left: 3rem; border: 0.1rem solid #444; background: none; box-sizing: border-box;}
.sub .visual .top a span,
.sub .visual .top button span{display: block; padding-right: 2.5rem; background: url('../images/common/ico_arw_r.png') right center no-repeat; color: #444; font-size: 1.8rem; line-height: 1;}
.sub .visual p{margin-top: 3rem; color: #444; font-size: 1.6rem; line-height: 160%;}
.sub .breadcrumb{display: flex; width: 1200px; margin: -11.4rem auto 2rem;}
.sub .breadcrumb li{position: relative; margin-right: 2.4rem; color: #444; font-size: 1.4rem; line-height: 100%;}
.sub .breadcrumb li::after{position: absolute; right: -1.5rem; top: 50%; width: 0.6rem; height: 1rem; margin-top: -0.5rem; background: url('../images/common/ico_breadcrumb.png') center no-repeat; content: "";}
.sub .breadcrumb li:last-child{margin-right: 0; font-weight: 600; color: #002756;}
.sub .breadcrumb li:last-child::after{display: none;}
.sub .content{width: 1200px; margin: 0 auto; border-radius: 2rem 2rem 0 0; background: #fff; overflow: hidden; box-sizing: border-box;}
.sub .content.type2{margin-top: 10rem; border-radius: 0; background: #fff;}
.sub .content > .inner{padding: 5rem 5rem 10rem;}
.sub .tab{display: flex;}
.sub .tab li{flex: 1; position: relative; background: #6E8E9B;}
.sub .tab li + li::before{position: absolute; left: 0; top: 50%; width: 0.1rem; height: 3rem; margin-top: -1.5rem; background: #fff; content: "";}
.sub .tab li a{display: block; color: #FFF; font-size: 2.2rem; font-weight: 700; line-height: 8rem; text-align: center;}
.sub .tab li.on a{border-radius: 2rem 2rem 0 0; background: #fff; color: #444; font-weight: 700;}
.sub .tab li.on + li::before{display: none;}
.sub .tab-sub{margin-top: 3rem; text-align: center;}
.sub .tab-sub ul{display: inline-flex;}
.sub .tab-sub ul li{position: relative; margin: 0 4rem;}
.sub .tab-sub ul li::after{position: absolute; left: -4rem; top: 50%; width: 0.1rem; height: 2rem; margin-top: -1rem; background: #888; content: "";}
.sub .tab-sub ul li:first-child::after{display: none;}
.sub .tab-sub ul li a{display: block; background: none; color: #444; font-size: 2.4rem; line-height: 5rem;}
.sub .tab-sub ul li.on a{color: #00A0E9; font-weight: 700;}


/* 헬스케어 */
.healthcare .visual{background: url('../images/healthcare/bg_visual.jpg') center / cover;}
.company{padding-bottom: 10rem; background: #fff;}
.company .overview{position: relative; padding-top: 14rem; background: #fff; text-align: center; box-sizing: border-box;}
.company .overview h3{display: block; color: #333; text-align: center; font-size: 3.8rem; font-weight: 700; line-height: 150%;}
.company .highlights{display: flex; justify-content: space-between; width: 108rem; margin: 10rem auto 0; background: url('../images/healthcare/bg_highlight.png') center / 36rem auto no-repeat;}
.company .highlights li{display: flex; align-items: center; justify-content: center; width: 36rem; height: 36rem; border-radius: 100%; background: #CCCCDC;}
.company .highlights li h4{display: block; color: #041F5A; text-align: center; font-size: 3.2rem; font-weight: 700; line-height: 140%;}
.company .highlights li p{margin-top: 2rem; color: #444; text-align: center; font-size: 2rem; line-height: 140%;}
.company .vision{margin-top: 12rem;}
.company .vision h4{display: block; margin-bottom: 3rem; color: #333; text-align: center; font-size: 3.8rem; font-weight: 700; line-height: 150%;}
.company .vision .img{margin-bottom: 5.5rem;}
.company .actions{margin-top: 9rem;}
.company .actions li + li{margin-top: 9rem;}
.company .actions li h4{display: block; color: #333; text-align: center; font-size: 3.8rem; font-weight: 700; line-height: 150%;}
.company .actions li h4 + p{color: #009D57; text-align: center; font-size: 3.2rem; font-weight: 700; line-height: 150%;}
.company .actions li h4 + p span{font-size: 2.8rem; font-weight: 400;}
.company .actions li .cont{display: flex; justify-content: space-between; margin-top: 3rem;}
.company .actions li .cont p{flex: 1; padding-left: 4rem; color: #000; font-size: 2rem; line-height: 180%;}
.company .actions li:nth-child(even) .cont p{order: -1; padding: 0; padding-right: 4rem; text-align: right;}
.business{height: 136.1rem; padding-top: 14rem; background: url('../images/healthcare/bg_business.jpg') center bottom; text-align: center; box-sizing: border-box;}
.business h3{display: block; color: #333; font-size: 3.8rem; font-weight: 700; line-height: 150%;}
.business p{margin-top: 3rem; color: #333; font-size: 2.8rem; line-height: 180%;}
.brand{padding: 0 0 15rem; background: #fff; text-align: center;}
.brand h3{display: block; margin-top: 8rem;}
.brand h3 span{display: block; margin-bottom: 3rem; color: #002756; font-size: 4.5rem; font-weight: 700; line-height: 150%;}
.brand .cont{display: none;}
.brand .cont.on{display: block;}
.brand .intro{color: #002756; font-size: 3.8rem; font-style: normal; font-weight: 500; line-height: 150%; text-align: center;}
.brand .txt1{margin-top: 8rem; color: #002756; text-align: center; font-size: 3.8rem; font-weight: 500; line-height: 150%;}
.brand .dia{margin-top: 8rem;}
.brand .txt2{margin-top: 4rem; color: #002756; font-size: 3.8rem; font-weight: 500; line-height: 150%;}
.brand .txt2 strong span{font-weight: 500;}
.brand .txt2 .type1{color: #00A0E9;}
.brand .txt2 .type2{color: #00BAB5;}
.brand .prd{position: relative; width: 110rem; padding: 8rem 0 5.5rem; margin: 11.7rem auto 0; border-radius: 5rem; border: 0.1rem solid #002756; background: #FFF;}
.brand .prd h4{display: inline-block; position: absolute; left: 50%; top: -3.9rem; transform: translateX(-50%); padding: 0 8rem; border-radius: 5rem; background: #002756; color: #FFF; text-align: center; font-size: 3.8rem; font-weight: 500; line-height: 7.8rem;}
.brand .prd h4 strong{font-weight: 800;}
.brand .prd ul{display: inline-flex;}
.brand .prd ul li{display: flex; align-items: flex-end; justify-content: center; position: relative; width: 12rem; height: 15.9rem; padding: 0 4rem; color: #002756; text-align: center; font-size: 2.6rem; font-weight: 500; line-height: 150%;}
.brand .prd ul li::after{position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 0.1rem; height: 12rem; background: #617596; content: "";}
.brand .prd ul li:first-child::after{display: none;}
.brand .prd ul li.item1{background: url('../images/healthcare/ico_prd1.png') center top no-repeat;}
.brand .prd ul li.item2{background: url('../images/healthcare/ico_prd2.png') center top no-repeat;}
.brand .prd ul li.item3{background: url('../images/healthcare/ico_prd3.png') center top no-repeat;}
.brand .prd ul li.item4{background: url('../images/healthcare/ico_prd4.png') center top no-repeat;}
.brand .prd ul li.item5{background: url('../images/healthcare/ico_prd5.png') center top no-repeat;}
.brand .prd ul li.item6{background: url('../images/healthcare/ico_prd6.png') center top no-repeat;}
.brand .prd ul li.item7{background: url('../images/healthcare/ico_prd7.png') center top no-repeat;}
.brand .prd ul li.item8{background: url('../images/healthcare/ico_prd8.png') center top no-repeat;}
.brand .prd ul li.item9{background: url('../images/healthcare/ico_prd9.png') center top no-repeat;}
.brand .prd .list2{margin-top: 2rem;}
.brand .txt3{margin-top: 4rem; color: #002756; text-align: center; font-size: 3.8rem; font-weight: 500; line-height: 150%;}
.brand .txt3 strong{font-weight: 800;}
.character{padding-bottom: 10rem; text-align: center;}
.character h3{display: block; margin-top: 8rem; color: #002756; text-align: center; font-size: 4rem; font-weight: 400; line-height: 150%;}
.character h3 strong{font-weight: 800;}
.character .healdory{margin-top: 3rem; text-align: center;}
.character .highlights{display: flex; justify-content: space-between; width: 108rem; margin: 10rem auto 0; background: url('../images/healthcare/bg_highlight2.png') center / 36rem auto no-repeat;}
.character .highlights li{display: flex; align-items: center; justify-content: center; width: 36rem; height: 36rem; border-radius: 100%; background: #CCECFB;}
.character .highlights li h4{display: block; color: #041F5A; text-align: center; font-size: 3.2rem; font-weight: 700; line-height: 140%;}
.character .highlights li p{margin-top: 2rem; color: #444; text-align: center; font-size: 2rem; line-height: 140%;}

/* 제품소개 */
.product .usage{position: relative; left: 50%; width: 1920px; margin-left: -960px; }
.product .usage .title{position: absolute; left: 220px; top: 8rem; text-align: left; z-index: 10;}
.product .usage .title strong{display: block; color: #002756; font-size: 6rem; font-weight: 800; line-height: 100%;}
.product .usage .title p{margin-top: 2rem; color: #4D4D4D; font-size: 2.2rem; font-weight: 600; line-height: 150%;}
.product .usage .box{position: relative; transform-origin: top;}
.product .usage .item{opacity: 0; transition: all 0.3s ease;}
.product .usage .item.on{opacity: 1;}
.product .usage .item1{position: absolute; left:1192px; top:204px; z-index:50;}
.product .usage .item2{position: absolute; left:735px; top:291px; z-index:10;}
.product .usage .item3{position: absolute; left:1079px; top:308px; z-index:53;}
.product .usage .item4{position: absolute; left:959px; top:220px; z-index:40;}
.product .usage .item5{position: absolute; left:1122px; top:676px; z-index:51;}
.product .usage .item6{position: absolute; left:549px; top:324px; z-index:40;}
.product .usage .item7{position: absolute; left:1345px; top:334px;}
.product .usage .item8{position: absolute; left:1377px; top:417px;}
.product .usage .point{border-radius:100%; box-shadow: 2px 2px 10px 0px rgba(0, 0, 0, 0.20);}
.product .usage .point1{position: absolute; left:753px; top:296px; z-index:40;}
.product .usage .point2{position: absolute; left:941px; top:250px; z-index:40;}
.product .usage .point3{position: absolute; left:1060px; top:307px; z-index:54;}
.product .usage .point4{position: absolute; left:1238px; top:209px; z-index:55;}
.product .usage .point5{position: absolute; left:863px; top:420px; z-index:40;}
.product .usage .point6{position: absolute; left:1120px; top:701px; z-index:52;}
.product .usage .point7{position: absolute; left:1416px; top:336px; z-index:40;}
.product .usage .point8{position: absolute; left:1452px; top:434px; z-index:40;}
.product .usage .ob1{position: absolute; left:956px; top:393px; z-index:41}
.product .usage .ob2{position: absolute; left:1079px; top:204px; z-index:42;}
.product .usage .ob3{position: absolute; left:549px; top:324px; z-index:30;}
.product .usage .ob4{position: absolute; left:1437px; top:360px; z-index:30;}
.product .usage .btn{display:block; text-indent:-9999em; z-index:60; background:yellow; opacity:0;}
.product .usage .btn-item1{position: absolute; left:1186px; top:201px; width:80px; height:42px;}
.product .usage .btn-item2{position: absolute; left:735px; top:293px; width:132px; height:127px;}
.product .usage .btn-item3{position: absolute; left:1060px; top:303px; width:184px; height:92px;}
.product .usage .btn-item4{position: absolute; left:941px; top:240px; width:58px; height:38px;}
.product .usage .btn-item5{position: absolute; left:1120px; top:677px; width:159px; height:63px;}
.product .usage .btn-item6{position: absolute; left:727px; top:420px; width:414px; height:188px;}
.product .usage .btn-item7{position: absolute; left:1345px; top:334px; width:99px; height:66px;}
.product .usage .btn-item8{position: absolute; left:1377px; top:417px; width:103px; height:57px;}
.product .visual{padding-top: 10rem;}
.product.pack .visual{background: url('../images/product/bg_pack.jpg') center / cover;}
.product.gown .visual{background: url('../images/product/bg_gown.jpg') center / cover;}
.product.glove .visual{background: url('../images/product/bg_glove.jpg') center / cover;}
.product.mask .visual{background: url('../images/product/bg_mask.jpg') center / cover;}
.product.sterile .visual{background: url('../images/product/bg_sterile.jpg') center / cover;}
.product.etc .visual{background: url('../images/product/bg_etc.jpg') center / cover;}
.product .breadcrumb li:last-child{color: #7B57C4;}
.product .content{padding: 8rem 5rem 10rem;}
.product .content h3{display: block; margin: 8rem 0 3rem; color: #333; font-size: 3.8rem; font-weight: 700; line-height: 150%;}
.product .content h3:nth-of-type(1){margin-top: 0;}
.product .expertise{display: flex; justify-content: space-between;}
.product .expertise li{width: 35rem; height: 35rem; padding-top: 18.7rem; border-radius: 3rem; text-align: center; box-sizing: border-box;}
.product .expertise li h4{display: block; color: #002755; font-size: 3rem; font-weight: 700; line-height: 100%;}
.product .expertise li p{margin-top: 1.5rem; color: #000; text-align: center; font-size: 2rem; line-height: 160%;}
.product.pack .expertise li.item1{background: url('../images/product/bg_pack_expertise1.png') center top no-repeat #F9F9F9;}
.product.pack .expertise li.item2{background: url('../images/product/bg_pack_expertise2.png') center top no-repeat #F9F9F9;}
.product.pack .expertise li.item3{background: url('../images/product/bg_pack_expertise3.png') center top no-repeat #F9F9F9;}
.product.gown .expertise li.item1{background: url('../images/product/bg_gown_expertise1.png') center top no-repeat #F9F9F9;}
.product.gown .expertise li.item2{background: url('../images/product/bg_gown_expertise2.png') center top no-repeat #F9F9F9;}
.product.gown .expertise li.item3{background: url('../images/product/bg_gown_expertise3.png') center top no-repeat #F9F9F9;}
.product .sms{display: flex; align-items: center; height: 35rem; padding-left: 693px; border-radius: 3rem; background: url('../images/product/bg_pack_sms.jpg') left center / 90% auto no-repeat #f9f9f9;}
.product .sms h4{display: block; color: #002755; font-size: 2.4rem; font-weight: 700; line-height: 100%;}
.product .sms p{margin-top: 1.5rem; color: #000; font-size: 2rem; line-height: 160%;}
.product .prd-list{display: flex; flex-wrap: wrap; gap: 5rem 36px;}
.product .prd-list + .prd-list{margin-top: 5rem;}
.product .prd-list li{position: relative; width: 250px;}
.product .prd-list li .label{position: absolute; left: 0; top: 0; width: 100%; background: #7B57C4; color: #FFF; text-align: center; font-size: 2rem; font-weight: 700; line-height: 5.2rem; z-index: 10;}
.product .prd-list li .img{display: flex; justify-content: center; align-items: center; position: relative; height: auto;}
.product .prd-list li .img::before{position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: 0.1rem solid #e6e6e6; box-sizing: border-box; content: "";}
.product .prd-list li .img img{width: 100%;}
.product .prd-list li p,
.product .prd-list li strong{display: block; margin-top: 1.2rem; color: #000; font-size: 1.8rem; font-weight: 500; line-height: 160%;}
.product .more{padding-top: 4rem; margin-top: 8rem; border-top: 0.1rem solid #D8D8D8;}
.product .more p{color: #000; font-size: 2rem; line-height: 160%;}
.product .more .btn-customer{display: inline-flex; align-items: center; height: 4.5rem; padding: 0 2rem; margin-top: 1.6rem; border: 0.1rem solid #444; box-sizing: border-box;}
.product .more .btn-customer span{display: block; padding-right: 2.5rem; background: url('../images/common/ico_arw_r.png') right center no-repeat; color: #444; font-size: 1.8rem; line-height: 140%;}
.product .pop-guide{display: none; align-items: center; justify-content: center; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); z-index: 1200;}
.product .pop-guide.on{display: flex;}
.product .pop-guide > div{position: relative; width: 1420px; padding: 6rem 0 3rem; border-radius: 2rem; background: #fff; text-align: center; box-sizing: border-box;}
.product .pop-guide .btn-close{position: absolute; right: 3rem; top: 3rem; width: 3.8rem; height: 3.8rem; background: url('../images/common/ico_close.png') center no-repeat; text-indent: -9999em;}
.product .view .detail{display: flex;}
.product .view .detail .img-box .swiper-container{overflow: hidden;}
.product .view .detail .img-box .big{width: 50rem;}
.product .view .detail .img-box .big .swiper-slide img{width: 100%;}
.product .view .detail .img-box .thum{position: relative; width: 50rem; margin-top: 2rem;}
.product .view .detail .img-box .thum .swiper-slide{position: relative; width: 8.4rem; height: 8.4rem; margin-right: 2rem; cursor: pointer;}
.product .view .detail .img-box .thum .swiper-slide:last-child{margin-right: 0;}
.product .view .detail .img-box .thum .swiper-slide::after{position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: 0.1rem solid #dbdbdb; box-sizing: border-box; opacity: 0; content: ""; transition: all 0.5s ease;}
.product .view .detail .img-box .thum .swiper-slide img{width: 100%;}
.product .view .detail .img-box .thum .swiper-slide.on::after{opacity: 1;}
.product .view .detail .img-box .thum .swiper-button-prev{left: -5rem; top: 0; width: 5rem; height: 100%; margin: 0; background: url('../images/product/btn_prev.png') center no-repeat;}
.product .view .detail .img-box .thum .swiper-button-prev::after{display: none;}
.product .view .detail .img-box .thum .swiper-button-next{right: -5rem; top: 0; width: 5rem; height: 100%; margin: 0; background: url('../images/product/btn_next.png') center no-repeat;}
.product .view .detail .img-box .thum .swiper-button-next::after{display: none;}
.product .view .detail .img-box .thum .swiper-button-next.swiper-button-disabled,
.product .view .detail .img-box .thum .swiper-button-prev.swiper-button-disabled{opacity: 0;}
.product .view .detail .info-box{padding-top: 5rem; margin-left: 10rem;}
.product .view .detail .info-box .ctg{display: block; font-weight: 600; font-size: 2rem; line-height: 160%; color: #002755;}
.product .view .detail .info-box .tit{display: block; margin-top: 0.5rem; font-weight: 700; font-size: 3rem; line-height: 140%; color: #000000;}
.product .view .detail .info-box .code{margin-top: 3rem;}
.product .view .detail .info-box .code li{font-weight: 500; font-size: 1.8rem; line-height: 160%; color: #000;}
.product .view .detail .info-box .btn-inquiry{display: block; width: 25rem; margin-top: 4rem; background: #B2B2B2; font-weight: 600; font-size: 2rem; line-height: 7rem; color: #fff; text-align: center;}
.product .view .detail + div{padding-top: 4rem; margin-top: 8rem; border-top: 0.1rem solid #d8d8d8;}
.product .view h3{display: block; margin-bottom: 1.5rem; font-weight: 700; font-size: 2.4rem; line-height: 150%; color: #333;}
.product .view table.type1{align-self: flex-start;}
.product .view table.type1 th,
.product .view table.type1 td{font-size: 1.8rem; line-height: 180%; color: #000; text-align: left; vertical-align: top;}
.product .view table.type1 th{width: 8rem; font-weight: 700;}
.product .view table.type1 td{padding-left: 2rem;}
.product .view table.type1 td ul.desc li{position: relative; padding-left: 1.2rem;}
.product .view table.type1 td ul.desc li::before{position: absolute; left: 0; top: 0; content: "-";}
.product .view table.type2{border-top: 0.2rem solid #3E3A39;}
.product .view table.type2 th,
.product .view table.type2 td{padding: 1.3rem 0; border-bottom: 0.1rem solid #CFCFCF; color: #000; text-align: center;}
.product .view table.type2 th{font-size: 1.8rem; line-height: 2.2rem; font-weight: 700;}
.product .view table.type2 td{font-size: 1.6rem; line-height: 2.2rem;}
.product .view .prd-info{display: flex;}
.product .view .prd-info table{width: 50%;}
.product .view .sec + .sec{padding-top: 8rem; margin-top: 4rem; border-top: 0.1rem solid #d8d8d8;}
.product .view .sec-detail{margin-top: 9.5rem; text-align: center;}

/* 캠페인 */
.campaign .visual{background: url('../images/campaign/bg_visual.jpg') center / cover;}
.campaign .purpose{width: 90rem; padding-bottom: 10rem; margin: 10rem auto 0; text-align: center;}
.campaign .purpose p{padding-top: 8rem; margin-top: 8rem; border-top: 0.1rem solid #D8D8D8; color: #002756; text-align: center; font-size: 2.8rem; line-height: 180%;}
.campaign .plan{position: relative; width: 112.2rem; height: 140rem; padding-bottom: 10rem; margin: 2.5rem auto 0; background: url('../images/campaign/bg_plan.jpg') no-repeat; background-size: 100% auto;}
.campaign .plan ol li{width: 40rem; text-align: center;}
.campaign .plan ol li strong{display: block; color: #002755; font-size: 3rem; font-weight: 700; line-height: 3.8rem;}
.campaign .plan ol li p{margin-top: 1rem; color: #000; text-align: center; font-size: 2rem; line-height: 160%;}
.campaign .plan ol li.item1{position: absolute; left: 21rem; top: 26rem;}
.campaign .plan ol li.item2{position: absolute; left: 65rem; top: 26rem;}
.campaign .plan ol li.item3{position: absolute; left: 58rem; top: 65.5rem;}
.campaign .plan ol li.item4{position: absolute; left: 13.5rem; top: 65.5rem;}
.campaign .plan ol li.item5{position: absolute; left: 32rem; top: 104.5rem;}
.campaign .objective{position: relative; width: 112.2rem; height: 140rem; padding-bottom: 10rem; margin: 2.5rem auto 0; background: url('../images/campaign/bg_objective.jpg') no-repeat; background-size: 100% auto;}
.campaign .objective ol li{width: 40rem; text-align: center;}
.campaign .objective ol li strong{display: block; color: #002755; font-size: 3rem; font-weight: 700; line-height: 3.8rem;}
.campaign .objective ol li p{margin-top: 1rem; color: #000; text-align: center; font-size: 2rem; line-height: 160%;}
.campaign .objective ol li.item1{position: absolute; left: 21rem; top: 26rem;}
.campaign .objective ol li.item2{position: absolute; left: 65rem; top: 26rem;}
.campaign .objective ol li.item3{position: absolute; left: 58rem; top: 65.5rem;}
.campaign .objective ol li.item4{position: absolute; left: 13.5rem; top: 65.5rem;}
.campaign .objective ol li.item5{position: absolute; left: 32rem; top: 104.5rem;}
.campaign .resource h3{display: block; color: #333; font-size: 30px; font-weight: 700; line-height: 150%;}
.campaign .resource .list{display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px 25px; margin-top: 30px;}
.campaign .resource .list li a{display: block;}
.campaign .resource .list li a .img{position: relative; width: 350px; aspect-ratio: 350 / 240; border-radius: 30px; overflow: hidden;}
.campaign .resource .list li a .img img{width: 100%; height: 100%; object-fit: cover;}
.campaign .resource .list li a p{margin-top: 24px; color: #000; font-size: 20px; font-weight: 500; line-height: 160%;}
.campaign .resource .list li a .img.play::after{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 60px; height: 60px; background: url('../images/common/ico_play.svg') no-repeat; content: "";}
.campaign .resource .list + h3{padding-top: 50px; margin-top: 50px; border-top: 1px solid #CFCFCF;}

/* 고객센터 */
.support .visual{background: url('../images/support/bg_visual.jpg') center / cover;}
.support .inquiry .guide-txt{color: #000; font-size: 3.2rem;font-weight: 500; line-height: 140%;}
.support .inquiry .cs-info{display: flex; justify-content: center; padding: 3rem 0; margin: 5rem 0 2rem; background: #F9F9F9;}
.support .inquiry .cs-info .tel{padding-left: 5.7rem; background: url('../images/support/ico_cs.svg') left center / auto 4.5rem no-repeat; color: #002756; font-size: 2.4rem; font-weight: 600; line-height: 4.5rem}
.support .inquiry .cs-info .tel strong{color: #002756; font-size: 3rem; font-weight: 600; line-height: 140%;}
.support .inquiry .cs-info .time{margin-left: 2.4rem; color: #333; font-size: 1.6rem; font-weight: 500; line-height: 4.5rem;}
.support .inquiry .btn-wrap{margin-top: 4rem; text-align: center;}

/* 시스템 오류 */
.error-wrap{display: flex; justify-content: center; align-items: center; width: 100%; height: 100%;}
.error-wrap .box{display: flex; justify-content: center; align-items: center; width: 140rem; height: 90rem; background: #fff;}
.error-wrap .box > div{padding-top: 29.5rem; background: url('../images/common/error.png') center top / 28.3rem auto no-repeat; text-align: center;}
.error-wrap .box h1{display: block; color: #002756; font-size: 5rem; font-weight: 700; line-height: 100%;}
.error-wrap .box p{margin-top: 4rem; color: #000; font-size: 2.4rem; font-weight: 500; line-height: 180%;}
.error-wrap .box .logo{width: 18.5rem; margin-top: 7rem;}

/* 이벤트 */
.event .visual{background: url('../images/event/bg_visual.jpg') center / cover;}
.event .view{padding: 5.5rem 0; text-align: center;}
.event .view > div{display: inline-block; position: relative;}