@charset "utf-8";

/* intro1 */
.intro1{}
.intro1 .top{display: flex; gap:0 75px;}
.intro1 .top .l_cont{}
.intro1 .top .l_cont h4{font-size: 24px; color: var(--c01); font-family: 'SUIT', sans-serif; margin-bottom: 20px;}
.intro1 .top .l_cont h3{font-size: 44px; color: #000; font-family: 'SUIT', sans-serif; font-weight: 800;}
.intro1 .top .r_cont{}
.intro1 .top .r_cont h4{font-size: 24px; color: #222; font-weight: 600; margin-bottom: 20px;}
.intro1 .top .r_cont p{font-size: 18px; color: #666666; font-weight: 500; line-height: 1.7em; word-break: keep-all;}
.intro1 .top .r_cont p span{font-weight: 600; color: var(--c01);}
.intro1 .bottom{margin-top: 70px; display: flex; gap:0 20px; justify-content: space-between;}
.intro1 .bottom .img{background-repeat: no-repeat; background-size: cover; background-position: center center; height: 555px;}
.intro1 .bottom .img.img1{width: calc(24.7% - 20px / 3); background-image: url(/images/sub/intro1_img1.webp);}
.intro1 .bottom .img.img2{width: calc(47.5% - 20px / 3); background-image: url(/images/sub/intro1_img2.webp);}
.intro1 .bottom .img.img3{width: calc(24.7% - 20px / 3); background-image: url(/images/sub/intro1_img3.webp);}

@media all and (max-width:1479px){
	.intro1 .top .l_cont{width: 354px;}
	.intro1 .top .l_cont h4{font-size: 22px;}
	.intro1 .top .l_cont h3{font-size: 40px;}
	.intro1 .top .r_cont{width: calc(100% - 354px - 75px);}
	.intro1 .top .r_cont h4{font-size: 22px; margin-bottom: 12px;}
	.intro1 .top .r_cont p{font-size: 17px;}
	.intro1 .top .r_cont p br{display: none;}
	.intro1 .bottom{margin-top: 50px;}
	.intro1 .bottom .img{height: 48vw;}
}

@media all and (max-width:1280px){
	.intro1 .top{gap:0 50px;}
	.intro1 .top .l_cont{width: 330px;}
	.intro1 .top .l_cont h4{font-size: 20px;}
	.intro1 .top .l_cont h3{font-size: 36px;}
	.intro1 .top .r_cont{width: calc(100% - 330px - 50px);}
	.intro1 .top .r_cont h4{font-size: 20px; margin-bottom: 10px;}
	.intro1 .top .r_cont p{font-size: 16px;}
}

@media all and (max-width:976px){
	.intro1 .top{flex-direction: column; text-align: center;}
	.intro1 .top .l_cont{width: 100%;}
	.intro1 .top .l_cont h4{font-size: 18px;}
	.intro1 .top .l_cont h3{font-size: 32px;}
	.intro1 .top .r_cont p{font-size: 15px;}
	.intro1 .top .r_cont{width: 100%; margin-top: 20px;}
	.intro1 .bottom{margin-top: 40px;flex-direction: column; gap: 20px;}
	.intro1 .bottom .img{width: 100% !important;}
}

@media all and (max-width:640px){
	.intro1 .top .l_cont h4{font-size: 16px;}
	.intro1 .top .l_cont h3{font-size: 28px;}
	.intro1 .top .r_cont{width: 100%; margin-top: 15px;}
}


#history_top { color:#fff; width: 100%; height: 480px; position: relative; display: table; padding: 0 5%; max-width: 1400px; margin: 0 auto;
    background: url("/images/sub/history_top.jpg") no-repeat center; background-size: cover; }
#history_top dl { display: table-cell; vertical-align: middle; }
#history_top dl dt { font-size: 6rem; font-weight: 700; font-family: 'Poppins'; }
#history_top dl dd { font-size: 1.8rem; line-height: 1.8em; }

@media all and (max-width:976px) {
#history_top { height: 38vw; }
#history_top dl dt { font-size: 4rem;}
#history_top dl dd { font-size: 1.6rem; line-height: 1.4em; }
}

@media all and (max-width:767px) {
#history_top { height: 45vw; }
#history_top dl dt { font-size: 3rem;}
}

@media all and (max-width:400px) {
    #history_top dl dd br{display: none;}
}


#history { overflow: hidden; position: relative; }
#history::before { content: ''; width:1px; height: 100%; background: #e9e9e9; position: absolute; left:50%; top:0; margin-left: -0.5px;}
#history li { overflow: hidden; position: relative; margin-top: 30px;}
#history li .txt { float: right; width: 50%; padding: 2% 0 2% 60px;}
#history li:nth-child(even) .txt { float: left; text-align: right; padding: 2% 60px 2% 0; }

#history li .txt h4 { color: #eb2a2e; font-size: 6rem; position: relative;
            line-height: 1.0em; font-weight: 600; margin-bottom: 0.5em; letter-spacing: 0; }
#history li .txt h4::before { content:''; width: 20px; height: 20px; display: block; position: absolute; left:-60px; top:50%; margin: -10px 0 0 -10px;
                        border-radius: 100%; background: #ff0000; border: 6px solid #ffe5e5; z-index:2;  }
#history li .txt h4::after { content:''; width: 50px; height: 1px; display: block; background: #ffb2b2; z-index:1;
                      position: absolute; left:-60px; top:50%; margin-top: -0.5px;}
#history li:nth-child(even) .txt h4::before,
#history li:nth-child(even) .txt h4::after { left: inherit; right: -60px; }
#history li:nth-child(even) .txt h4::before {margin: -10px -10px 0 0; }
#history li .txt dl { margin-bottom: 1.5em; font-size: 1.8rem; }
/*#history li .txt dl dt { width:60px; display:inline-block; vertical-align:top; margin-bottom:15px; color:#212121; font-weight: 600; line-height: 1.5em; } */
#history li .txt dl dd {width:100%; display:inline-block; vertical-align:top; margin-bottom:15px; line-height: 1.5em; }

#history li:nth-child(even) dt { float: right; }


@media all and (max-width:976px) {
    #history li .txt h4 {font-size: 3rem;}

}
@media all and (max-width:767px) {
#history li .txt { padding: 2% 0 2% 40px; }
#history li:nth-child(even) .txt { padding: 2% 40px 2% 0; }

#history li .txt h4::after { width: 30px; }
#history li .txt h4::before,
#history li .txt h4::after { left: -40px; }
#history li:nth-child(even) .txt h4::before,
#history li:nth-child(even) .txt h4::after { right: -40px; }
}

@media all and (max-width:568px) {
#history::before { left: 8px; margin-left:0;}
#history li .txt { width: 100%; padding: 2% 0 2% 40px; }
#history li:nth-child(even) .txt { text-align: left; padding: 2% 0 2% 40px; }
#history li .txt h4::before { width: 16px; height: 16px; margin: -8px 0 0 0; border-width: 5px; }
#history li:nth-child(even) .txt h4::before { margin: -8px 0 0 0; }
#history li:nth-child(even) .txt h4::before,
#history li:nth-child(even) .txt h4::after { right: inherit; left: -40px; }
}



.table-t { width:100%;  border-top: 2px solid #c93131; line-height: 1.4em;}
.table-t th,
.table-t td { text-align: left; padding: 1.15em 1.8em; border-bottom: 1px solid #f5e9e9; }
.table-t td.td-f {border-left: 1px solid #f5e9e9;}
.table-t th { width:200px;  font-size:1.8rem; text-align:center; background: #faf6f6; color:#212121; font-weight: 600; text-transform:uppercase; letter-spacing:0; word-break: keep-all;}
.table-t td { font-size:1.7rem; background: #FFF; line-height: 20px;}
.table-t td .br480 {display:none}

@media all and (max-width:1550px) {
	.table-t th { width:160px;}
}
@media all and (max-width:620px) {
	.table-t th,
	.table-t td { padding:1em; font-size:1.6rem; }
	.table-t th { width:120px; font-size:1.5rem; }
}
@media all and (max-width:480px) {
	.table-t th,
	.table-t td { padding: 0.8em; }
	.table-t td .br480 {display:block}
}


.intro3{}
.intro3 .wrap_controllers{display: none;}
.intro3 .map_info{max-width: 1200px; margin: -66px auto 0; background-color: #fff; position: relative; z-index: 2; border: 1px solid #eee; display: flex;}
.intro3 .map_info h3{ display: flex; justify-content: center; align-items: center; padding: 0 5em; border-right: 1px dashed #ddd;}
.intro3 .map_info ul{padding: 1rem 3rem; width: 100%;}
.intro3 .map_info ul li{display: flex; margin: 2rem 0;}
.intro3 .map_info ul li span{display: block; width: 80px; font-size: 1.9rem; font-weight: bold; color: #000;}
.intro3 .map_info ul li span i{color: #f4c900; display: inline-block; width: 30px; text-align: center;}
.intro3 .map_info ul li p{font-size: 1.7rem; transform: skew(0.1deg);}

@media all and (max-width:976px){
	.intro3 .root_daum_roughmap .wrap_map{height: 55vw !important; min-height: 350px;}
    .intro3 .map_info{flex-direction: column;}
	.intro3 .map_info h3{ padding: 2rem; order: -1;  border-right:0;  border-bottom: 1px dashed #ddd;}
    .intro3 .map_info h3 img{max-width: 48px;}
	.intro3 .map_info ul{padding: 1.5rem 3rem;}
	.intro3 .map_info ul li{flex-direction: column;}
	.intro3 .map_info ul li p{margin-top: 10px; font-size: 1.6rem; letter-spacing: -0.06em;}
}
@media all and (max-width:640px){
    .intro3 .map_info h3 img{max-width: 40px;}
    .intro3 .map_info ul{padding: 2rem;}
    .intro3 .map_info ul li{margin: 0; margin-bottom: 2rem;}
    .intro3 .map_info ul li:last-child{margin-bottom: 0;}
}



.pro-top { position: relative; display: table; table-layout: fixed; width: 100%; overflow: hidden; }
.pro-top > div { position: relative; text-align: center; display: table-cell; vertical-align: middle; }
.pro-top .img img { max-width: 100%; }
.pro-top .cont { width: 50%;  color:#fff; background: #b00708 ;border-radius: 0 40px 0 0; padding: 0 3%; }
.pro-top .cont::before { content:''; position: absolute; width: calc(100% - 40px); height: calc(100% - 40px);	top: 20px; left: 20px; border: 1px solid rgba(255,255,255,0.3); border-radius: 0 40px 0 0; }
.pro-top .cont h3 { font-size: 4rem; font-weight: 800;   margin-bottom: 30px;}
.pro-top .cont p { font-size: 1.8rem; font-weight: 500; line-height: 1.7em; word-break: keep-all;}
.pro-top .cont .en { max-width: 100%; font-size: 1rem; letter-spacing: 0.5em; font-family: 'Poppins'; margin: 1em 0 0.5em; }
.pro-top .cont .en span { font-weight: 800; }


@media all and (max-width:976px){
	.pro-top { display: block; }
	.pro-top > div { display: block; }
	.pro-top .img { width: 90%; }
	.pro-top .img img { max-width: 100%;  }
	.pro-top .cont { width: 90%; max-width: 500px; padding: 7% 3%; float: right; margin-top: -20%;
												background-color:rgba(198,26,27, 0.95); }
	.pro-top .cont h3 { font-size: 4rem; }
}

@media all and (max-width:640px){
	.pro-top .img { width: 100%; border-radius: 30px 0 0 0; overflow: hidden; }
	.pro-top .cont { width: 100%; margin-top:-30px; padding: 10% 5%; border-radius: 0 30px 0 0;}
	.pro-top .cont::before { border-radius: 0 30px 0 0; }
	.pro-top .cont h3 { font-size: 3.6rem; }
	.pro-top .cont .en { letter-spacing: 0.25em; }
}

@media all and (max-width:400px){
	.pro-top .cont h3 { font-size: 3.2rem; }
}


.s_tit{font-size: 3rem; color: #212121; font-weight: 800;}
.s_tit2{padding: 60px 30px;}
.s_tit span{color: #e60012;}
.s_txt{margin-bottom: 30px; font-size: 1.8rem; color: #666;}

@media all and (max-width:1040px){
    .s_tit2{padding: 40px 20px;}
}
@media all and (max-width:976px){
    .s_tit{font-size: 2.7rem; margin: 0 0 10px; padding-bottom: 15px;}
}
@media all and (max-width:640px){
    .s_tit{font-size: 2.5rem;}
}




.product_cha{display: flex; justify-content: space-between; flex-wrap: wrap;}
.product_cha .cha{width: 49%; margin-bottom: 30px;}
.product_cha .cha .img{padding: 30px; background-color: #fafafa; text-align: center;}
.product_cha .cha .img img{max-width: 100%;}
.product_cha .cha ul{margin-top: 25px;}
.product_cha .cha p{font-size: 1.9rem; color: #212121; font-weight: 400; margin-bottom: 10px; font-weight: 600; padding-left: 18px; position: relative; line-height: 1.5em;}
.product_cha .cha ul li{font-size: 1.9rem; color: #212121; font-weight: 400; margin-bottom: 10px; font-weight: 600; padding-left: 18px; position: relative; line-height: 1.5em;}
.product_cha .cha ul li::before{content: '·'; font-weight: 800; color: #e60012; margin-right: 10px; position: absolute; top: 0; left: 0;}
.product_cha .cha ul li p{font-weight: 300; font-size: 1.8rem; color: #666; margin-top: 10px; line-height: 1.5em;}

@media all and (max-width:976px){
    .product_cha{flex-direction: column;}
    .product_cha .cha{width: 100%;}
    .product_cha .cha ul li{font-size: 1.8rem; margin-bottom: 8px;}
}


.proCont { display: flex; align-items: flex-start; flex-wrap: wrap; justify-content: space-between; padding: 6em 3em; border-bottom: 1px dashed #ddd;}
.proCont .tit { width: 20%; }
.proCont .cont { width: 75%; font-size: 1.8rem; line-height: 1.8em; }


/* .proCont.wid100 { gap: 1em; } */
.proCont.wid100 .tit { width: 100%; }
.proCont.wid100 .cont { width: 100%; }

@media all and (max-width:1280px){
  .proCont .tit { width: 23%; }
  .proCont .cont { width: 72%; }
}

@media all and (max-width:1080px){
  .proCont { padding: 4em 2em; }
  .proCont .tit { width: 100%; }
  .proCont .cont { width: 100%; }
}


.dotList li { display: flex;  gap: 0.5em; color:#212121; align-items: flex-start; border-bottom: 1px solid #e9eff5; padding: 0.7em 0;  }
.dotList li::before { content: '·'; color:#e60012; font-weight: 800; font-size: 1.4em;  line-height: 0.8em;  }
.dotList li + li { margin-top: 0.5em; }
.dotList.mts li + li { margin-top: 0.2em; }
.dotList li p { line-height: 1.25em; font-weight: 300; }
.dotList p.bbt {border-bottom: 1px solid #e9eff5; padding: 20px;}


.checkList { position: relative; width: 100%; display: flex; flex-wrap: wrap; align-items: stretch; gap: 10px; font-size: 1.7rem; }
.checkList li { display: flex; align-items: center; line-height: 1.25em; background: #fcf4f4; border-radius: 2em; padding: 0 10px;}
.checkList li p { color:#a87272; padding: 10px; display: flex; align-items: center;}
.checkList li p span{font-size: 20px; margin-right: 5px;}


@media all and (max-width:976px){
  .checkList li::before { width: 36px; height: 36px; background-size: 40% auto; }
  .checkList li p { max-width: calc(100% - 36px); }
}

@media all and (max-width:880px){
  .checkList { gap: 5px; }
  .checkList li { width: 100%; border-radius: 3em;  }
  .checkList li p { padding: 0.5em 1em 0.5em 0.5em; }
}

@media all and (max-width:480px){
  .checkList li { }
  .checkList li::before { width: 32px; height: 32px; }
  .checkList li p { max-width: calc(100% - 32px); }
}


.tb-scroll { position: relative; width: 100%; overflow-x: auto; }

.tb-style1 { width: 100%; border-top: 5px solid #ecdbdb; font-size: 1.5rem; line-height: 1.4em; text-align: center; }
.tb-style1 th, .tb-style1 td { padding: 0.8em 0.7em; border-bottom: 1px solid #f5e9e9; border-right: 1px solid #f5e9e9; }
.tb-style1 th.br1, .tb-style1 td.br1 { border-right: 1px solid #f5e9e9; }
.tb-style1 thead th { font-size: 1.6rem; padding: 1em 0.7em; font-weight: 800; color:#773838; background: #fcf9f9; border-bottom-color:#e3d1d1; }
.tb-style1 thead th.bd2 { border-bottom: 1px solid #f5e9e9; }
.tb-style1 tbody th { font-weight: 700; color:#a87272; } /*background: #fbfcfd;  f5f9fc*/
.tb-style1 td { padding: 1em 0.7em;  }
.tb-style1 tr > th:last-child,
.tb-style1 tr > td:last-child { border-right-width:0; }
.tb-style1 p + p { margin-top: 0.4em; }
.tb-style1 .br1 { border-right: 1px solid #f5e9e9 !important; }
.tb-style1 .th { color:#a87272; }

.tb-style1.fs-s { font-size: 1.4rem; }
.tb-style1.fs-s thead th { font-size: 1.5rem; }