
/*  공통 */
/* p,span{color: #333;}
.sub-pg-dot-txt span{ font-size: 30px;}
span{ font-size: 18px; line-height: 1.5;}
span.underline{ border-bottom: 1px solid #7d63b7;}
.sub-cont .tit{ font-size: 42px; color: #333; text-align: center;}
.sub-cont .tit strong{ display: block;}
.sub-cont .tit:after{ content: ""; display: inline-block; width: 70px; height: 11px; background: url(../image/sub/sub_line.png) no-repeat; text-align: center; margin: 25px auto 40px;}
.sub-cont .txt{ font-size: 18px; color: #333; text-align: center;}
.sub-cont .txt span{ letter-spacing: -0.6px;}

.guide { width: 1200px; margin: 0 auto; background-color: #f6f6f6; } 
.guide p { text-align: center; font-size: 24px; padding: 20px 0; vertical-align: middle; font-weight:bold; } 
.guide p img { position: relative; top: -4px; padding-right: 5px; } 

.mar100{ margin: 100px 0;}

.sub-pg-dot-txt span{ color: #7d63b7;}*/


/*윤민*/
.subCon{padding-bottom:160px;}
.subCon *{line-height:170%;}
.subCon .con_tag{color:var(--color1); font-weight:bold; font-size:18px;}
.pageTit{text-align:center; margin-bottom:50px; font-size:42px; line-height:1;}

ul.tabs{margin:0 auto; padding:0px; list-style:none; text-align:center; width:100%; display:flex; justify-content:space-between;}
ul.tabs li{display:inline-block; background:#3b3f42; color:#d0d0d0; padding:10px 15px; cursor:pointer;width:100%; height:60px; font-weight:bold; box-sizing:border-box;  text-align:center; font-size:20px; vertical-align:middle; line-height:40px;}
ul.tabs li.current{background:#151515; color:#f5f5f7;}
.tab-content{display:none;padding:0px;}
.tab-content.current{display:inherit;}



.sub-layout{box-sizing:border-box;}
.sub-layout.padd{padding:100px 0;}
.sub-layout.pad-top{padding:100px 0 0;}
.sub-layout.pad-top-mini{padding:60px 0 0;}
.sub-layout.padd-top-mini{padding:60px 0 100px;}
.layout-title{text-align:center; font-size:40px; margin-bottom:50px; position:relative;}
.layout-title.size{font-size:36px}
.layout-title.bar:before{width:60px; height:4px; background:#5883ac; content:''; display:block; position:absolute; left:50%; top:-20px; transform:translateX(-50%)}
.layout-title2{text-align:left; font-size:26px; margin-bottom:35px; position:relative;}
.layout-title.layout-title3{font-size:32px; margin-bottom:30px;}
.layout-txt{text-align:center; font-size:20px;}
.layout-txt2{text-align:center; font-size:18px; margin-top:35px;}
.layout-title + .layout-txt{margin-top:-40px;}
.layout-inner {width: 1200px; margin: 0 auto;}
.layout-line{width:100%; max-width:1200px; height:1px; border:none; content:''; background:#ddd; margin:120px auto;}
ul.sub-layout-tabs{width:1200px; margin:0 auto 70px; gap:40px;}
ul.sub-layout-tabs li{width:100%; height:60px; border-radius:100vw; display:flex; align-items:center; justify-content:center; text-align:center; border:1px solid #ddd; font-size:20px; background:#fff; color:#333; font-weight:normal; transition:background .3s ease; cursor:pointer;}
ul.sub-layout-tabs li.current{background:#5883ac; color:#fff; font-weight:bold; transition:background .3s ease;}

.sub-layout.layout-banner{width:100%; padding:100px 0; box-sizing:border-box; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; background:#324c64;}
.sub-layout.layout-banner img{width:74px; max-height:73px; object-fit:contain;}
.sub-layout.layout-banner h4{color:#fff; text-align:Center; font-size:40px; margin:30px auto 50px;}
.sub-layout.layout-banner p{font-weight:300; color:#fff; text-align:Center; font-size:20px; margin:50px auto 30px;}
.sub-layout.layout-banner h6{color:#fff; text-align:Center; font-size:60px; font-family:'InkLiquid'; font-weight:normal; letter-spacing:-0.06em; width:fit-content; position:relative;}
.sub-layout.layout-banner h6:before, .sub-layout.layout-banner h6:after{font-family:'NamyangjuGothic'; opacity:0.2; line-height:1; font-size:150px; position:absolute; top:0;}
.sub-layout.layout-banner h6:before{content:'“'; right:calc(100% + 5px);}
.sub-layout.layout-banner h6:after{content:'”'; left:calc(100% + 5px);}
.sub-layout.layout-banner h6 + p{margin-top:40px; margin-bottom:0;}



.sub-layout.layout-card {}	
.sub-layout.layout-card .content { display: grid; grid-template-columns: repeat(2, 1fr); gap: 100px 80px; }
.sub-layout.layout-card .card-item { display: flex; flex-direction: column; }
.sub-layout.layout-card .card-item .img { width: 100%; aspect-ratio: 14 / 9; background-color: #f2f2f2; }
.sub-layout.layout-card .card-item .txt { margin-top: 30px; }
.sub-layout.layout-card .card-item h4 {color:#5883ac; font-size:36px; font-weight:bold;}
.sub-layout.layout-card .card-item p {font-size:20px; text-align:justify; margin-top:20px;}

.sub-layout.layout-chk{}
.sub-layout.layout-chk .content{background:#f3f6f9; padding:50px; box-sizing:border-box;}
.sub-layout.layout-chk .content + p{font-size:18px; text-align:center; margin-top:30px;}
.sub-layout.layout-chk h6{font-size:26px; margin-bottom:12px;}
.sub-layout.layout-chk ul{ display:flex; flex-direction:column; gap:20px;}
.sub-layout.layout-chk ul li{padding-left:50px; box-sizing:border-box; position:relative; font-size:20px;}
.sub-layout.layout-chk ul li:before{content:''; display:block; width:26px; height:26px; background:url(../image/sub/layout-chk.png) center center / cover no-repeat; position:absolute; top:50%; left:0; transform:TranslateY(-50%);}
.sub-layout.layout-chk ul li b{color:#325b82}
.sub-layout.layout-chk.half{}
.sub-layout.layout-chk.half .content{background:none; padding:0; display:flex; gap:40px;}
.sub-layout.layout-chk.half .content > div{background:#f8f8f8; box-sizing:border-box; padding:50px; width:100%;}
.sub-layout.layout-chk.half h6{font-size:26px; margin-bottom:35px; display:flex; align-items:center; gap:12px;}
.sub-layout.layout-chk.half .content > div:only-child ul{display:grid; grid-template-columns:repeat(2, 1fr);}
.sub-layout.layout-chk.half .content > div:only-child ul li{}
.sub-layout.layout-chk.half.solo ul{ display:flex !important; flex-direction:column !important; gap:20px;}
.sub-layout.layout-chk.triple .content{gap:15px;}
.sub-layout.layout-chk.triple .content > div{padding:40px 30px; display:flex; flex-direction:column; justify-content:space-between;}
.sub-layout.layout-chk.triple h6:has(+ span) {margin-bottom:5px !important;}
.sub-layout.layout-chk.triple span{font-size:18px; color:#999}
.sub-layout.layout-chk.triple ul{margin-top:25px;}
.sub-layout.layout-chk.triple ul li{font-size:18px; padding-left:40px;}



.sub-layout.layout-media-text .content{display:flex; align-items:Center; gap:50px;}
.sub-layout.layout-media-text .txt ul { counter-reset: step; display:flex; flex-direction:column; gap:20px;}
.sub-layout.layout-media-text .txt li { position: relative; padding:5px 0 5px 55px; counter-increment: step;  box-sizing:border-box; font-size:20px;}
.sub-layout.layout-media-text .txt li::before { content: counter(step, decimal-leading-zero); position: absolute; left: 0; top: 50%; font-weight: bold; color:#fff; width:40px; height:40px; background:#5883ac; font-size:18px; display:flex; align-items:center; justify-content:center; text-align:center; border-radius:50%; transform:translateY(-50%)}
.sub-layout.layout-media-text .txt li span{display:block; font-size:18px;}
.sub-layout.layout-media-text .txt dd { position: relative; padding:20px 0 0 0; box-sizing:border-box; font-size:22px;}
.sub-layout.layout-media-text .txt dd::before {/* content: '→'; position: absolute; left: 0; top:calc(50% + 10px); transform:translateY(-50%); font-weight: bold; font-size:22px; line-height:;*/}

.sub-layout.layout-wide-img{background:#eef2f7;}
.sub-layout.layout-wide-img picture img{width:100%; margin:40px auto 0;}
.sub-layout.layout-wide-img picture +.layout-txt{margin-top:45px;}
.sub-layout.layout-wide-img .layout-inner > picture:first-child img{margin-top:0;}


.sub-layout.layout-card-detail{}
.sub-layout.layout-card-detail .content{ display: grid; grid-template-columns: repeat(1, 1fr);}
.sub-layout.layout-card-detail .item{ display: flex; gap:40px; justify-content:space-between;}
.sub-layout.layout-card-detail .item .img{order:2;}
.sub-layout.layout-card-detail .item .txt{order:1; width:50%;}
.sub-layout.layout-card-detail .item h4{text-align:left; font-size:36px; font-weight:bold; color:#5883ac; line-height:150%;}
.sub-layout.layout-card-detail .item h5{text-align:left; margin:0 0 35px; font-size:22px; color:#888; font-weight:normal;}
.sub-layout.layout-card-detail .item p{text-align:justify; margin-top:35px; font-size:20px; word-break:normal;}
.sub-layout.layout-card-detail .item h6{text-align:left; margin:40px 0 12px; font-size:28px;}
.sub-layout.layout-card-detail .item h6:has(+ p){margin-bottom:5px;}
.sub-layout.layout-card-detail .item h6 + p{margin-top:5px;}
.sub-layout.layout-card-detail .item ul{}
.sub-layout.layout-card-detail .item ul li{font-size:20px; box-sizing:border-box; padding-left:8px; position:relative;}
.sub-layout.layout-card-detail .item ul li + li{margin-top:5px;}
.sub-layout.layout-card-detail .item ul li:before{content:'·'; position:absolute; left:0; top:0;}


.sub-layout.layout-disease{}
.sub-layout.layout-disease .content{ display: grid; grid-template-columns: repeat(2, 1fr); gap:80px;}
.sub-layout.layout-disease .item{ display: flex; flex-direction:column; gap:35px;}
.sub-layout.layout-disease .item .img{width:100%;}
.sub-layout.layout-disease .item .img img{width:100%;}
.sub-layout.layout-disease .item .txt{}
.sub-layout.layout-disease .item .txt h4{font-size:36px; font-weight:bold; color:#5883ac; margin-bottom:30px;}
.sub-layout.layout-disease .item .txt ul{}
.sub-layout.layout-disease .item .txt ul li{font-size:20px; box-sizing:border-box; padding-left:10px; position:relative;}
.sub-layout.layout-disease .item .txt ul li + li{margin-top:5px;}
.sub-layout.layout-disease .item .txt ul li:before{content:'·'; position:absolute; left:0; top:0;}
.sub-layout.layout-disease .item .txt ul.bar li:before{content:'-';}
.sub-layout.layout-disease .item .txt h5{font-size:26px; font-weight:bold; margin-bottom:12px;}
.sub-layout.layout-disease .item .txt p{font-size:20px; text-align:justify; margin-top:12px;}
.sub-layout.layout-disease .item .txt h5:has(+ p){margin-bottom:10px;}
.sub-layout.layout-disease .item .txt h5 + p{margin-top:10px;}
.sub-layout.layout-disease.type2{}
.sub-layout.layout-disease.type2 .content{display:flex; justify-content:center; gap:40px; flex-wrap:wrap;}
.sub-layout.layout-disease.type2 .item{width:calc(33.33% - 26.67px)}
.sub-layout.layout-disease.type2 .item .txt p{font-size:18px;}
.sub-layout.layout-disease.type3 .content{ gap:40px;}
.sub-layout.layout-disease.type3 .item{background:#fff; box-sizing:border-box; padding:30px 40px; border-radius:16px;}
.sub-layout.layout-disease.type3 .item .img{width:45px; height:49px;}
.sub-layout.layout-disease.type3 .item .img img{width:100%; height:100%; object-fit:contain;}
.sub-layout.layout-disease.type3 .item .txt p{font-size:18px;}



.sub-layout.layout-step .content{display:flex; align-items:Center; gap:50px; counter-reset: step; gap:18px;}
.sub-layout.layout-step .content .item { position: relative; padding:65px 0 40px; counter-increment: step;  box-sizing:border-box; display:flex; flex-direction:column; justify-content:flex-start; align-items:center; background:#f3f6f9; width:100%;}
.sub-layout.layout-step .content .item::before { content: counter(step, decimal-leading-zero); position: absolute; left: 50%; top: 20px; font-weight: bold; color:#fff; width:32px; height:32px; background:#5883ac; font-size:16px; display:flex; align-items:center; justify-content:center; text-align:center; border-radius:50%; transform:translateX(-50%)}
.sub-layout.layout-step .content .item h4{font-size:22px; margin-bottom:15px; text-align:center;}
.sub-layout.layout-step .content .item h4 small{font-size:18px}
.sub-layout.layout-step .content .item p{font-size:18px; text-align:center;}
.sub-layout.layout-step .content .item p small{font-size:16px}
.sub-layout.layout-step .content + p{text-align:center; margin:30px auto 0; font-size:24px; font-weight:500;}


.sub-layout.layout-step2{}
.sub-layout.layout-step2 .content{gap:28px 32px; display:grid; grid-template-columns:repeat(3, 1fr)}
.sub-layout.layout-step2 .content .item{padding:28px; align-items:flex-start; gap:20px; flex:1;}
.sub-layout.layout-step2 .content .item:before{display:none;}
.sub-layout.layout-step2 .content .item .top{display:flex; align-items:Center;font-size: 26px; font-weight: 700; line-height: 100%; /* 26px */}
.sub-layout.layout-step2 .content .item .top span{font-weight: bold; color:#fff; width:32px; height:32px; background:#5883ac; font-size:16px; display:flex; align-items:center; justify-content:center; text-align:center; border-radius:50%; margin-right:8px;}
.sub-layout.layout-step2 .content .item .top small{font-size: 24px;  font-weight: 400; line-height: 100%; margin-left:4px;}
.sub-layout.layout-step2 .content .item .bot{display:flex; align-items:center;}
.sub-layout.layout-step2 .content .item .bot img{margin-right:16px;}
.sub-layout.layout-step2 .content .item .bot p{text-align:left; color: #333; font-size: 18px; font-weight: 400; line-height: 170%; /* 30.6px */}
.sub-layout.layout-step2 .noti{margin-top:28px; display: flex; padding: 20px 28px; justify-content: space-between; align-items: flex-start; background: #F3F6F9;}
.sub-layout.layout-step2 .noti > div:nth-of-type(1){display: flex; align-items: center; gap: 12px; color: #5883AC;  font-size: 18px;  font-weight: 700; line-height: 170%; /* 30.6px */}
.sub-layout.layout-step2 .noti > div:nth-of-type(2){color: #505050; font-size: 16px; font-weight: 400; line-height: 170%; /* 27.2px */}

.layout-zigzag{}
.layout-zigzag .content{display:flex; flex-direction:column; gap:35px;}
.layout-zigzag .item{display:flex; gap:30px;}
.layout-zigzag .item > div{width:100%;}
.layout-zigzag .item > div.img{}
.layout-zigzag .item > div.img img{width:100%;}
.layout-zigzag .item > div.txt{padding:30px 20px; box-sizing:border-box;}
.layout-zigzag .item > div.txt h4{display:flex; font-size:26px; gap:10px; align-items:flex-end;}
.layout-zigzag .item > div.txt h4 span{color:#5883ac; font-size:18px;}
.layout-zigzag .item > div.txt p{margin-top:30px; font-size:20px;}
.layout-zigzag .content > div:nth-child(even) .img{order:2;}
.layout-zigzag .content > div:nth-child(even) .txt{order:1; padding:30px 0;}
.layout-zigzag .content + p{text-align:center; margin:70px auto 0; font-size:26px;}

.layout-zigzag.type2{}
.layout-zigzag.type2 .item > div.txt{padding:30px 0 30px 15px;}
.layout-zigzag.type2 .item > div.txt p{margin-top:20px; font-size:18px;}
.layout-zigzag.type2 .content > div:nth-child(even) .img{order:1;}
.layout-zigzag.type2 .content > div:nth-child(even) .txt{order:2; padding:30px 0;}



.layout-icon{}
.layout-icon .content{display:flex; justify-content:center; gap:84px;}
.layout-icon .item{display:flex; gap:20px; flex-direction:column; align-items:Center;}
.layout-icon .item > div{width:100%;}
.layout-icon .item > div.img{width:140px;}
.layout-icon .item > div.img img{width:100%;}
.layout-icon .item > div.txt{}
.layout-icon .item > div.txt p{font-weight:bold; text-align:center; font-size:20px;}


.layout-slider{}
.layout-slider .layout-slider-wrap{display:flex; flex-direction:column; gap:50px; counter-reset:step;}
.layout-slider .layout-slider-wrap > div{flex:1 1 0; min-width:0; counter-increment:step;}
.layout-slider .layout-slider-wrap > div h4{font-size:36px; font-weight:bold; margin-bottom:12px; text-align:left; position:relative; padding-left:55px;}
.layout-slider .layout-slider-wrap > div h4::before{content:counter(step, decimal-leading-zero); position:absolute; left:0; top:50%; width:40px; height:40px; display:flex; align-items:center; justify-content:center; color:#fff; background:#5883ac; font-size:18px; font-weight:bold; text-align:center; border-radius:50%; transform:translateY(-50%);}
.layout-slider .layout-slider-wrap .swiper{width:100%;}
.layout-slider .layout-slider-wrap .swiper-slide img{display:block; width:100%; height:auto;}

.layout-slider .layout-slider-wrap .swiper-button-next, 
.layout-slider .layout-slider-wrap .swiper-button-prev{width:50px; height:50px; background:#5883ac; border-radius:50%;}
/* .layout-slider .layout-slider-wrap .swiper-button-next{right:0;}
.layout-slider .layout-slider-wrap .swiper-button-prev{left:0;} */

.layout-slider .layout-slider-wrap .swiper-button-next:after, 
.layout-slider .layout-slider-wrap .swiper-button-prev:after{color:#fff; font-size:24px; font-weight:700;}