@font-face {
    font-family: Spoqa Han Sans;
    src: url(https://frontend-design-system.socar.kr/fonts/SpoqaHanSansRegular.woff2);
    font-weight: normal;
}

@font-face {
    font-family: Spoqa Han Sans;
    src: url(https://frontend-design-system.socar.kr/fonts/SpoqaHanSansBold.woff2);
    font-weight: bold;
}



section{margin: 0px; word-break:keep-all; overflow-wrap:break-word; font-family:'Spoqa Han Sans',sans-serif;}
body,html{ overflow-x:hidden; margin: 0px; word-break:keep-all; overflow-wrap:break-word; font-family:'Spoqa Han Sans',sans-serif; background: #ffffff;}
p{margin-block-start:18px; margin-right: 10px; margin-bottom: 24px;}
li, ul{text-decoration: none; margin: 0px; padding-inline-start:0px;}
h1{color:#00469D;}
a{text-decoration:none; color:#28323C;}

h1{font-weight: bold;}
b1,h3{font-weight: normal;}
h1{font-size:30px; line-height:140%; margin-block-start: 0px;}
h2{font-size:24px; line-height:140%; color:#161D24;text-align: center;}
h3{font-size:16px;line-height: 160%;color: #374553;text-align: center;}

s1{font-size:16px; line-height:170%; color:#646f7c;}
s2{font-size:16px; line-height:170%; color:#646f7c;}

b1{font-size:14px; line-height:30px;color:#fff;}
b2{font-size:16px; line-height:160%;}
b3{font-size:16px; line-height:160%; color: #fff;font-weight: bold; }
c1{font-size:12px; line-height:180%;color: #646f7c;}
c2{font-size: 12px; line-height: 160%; color: #646f7c; font-weight:regular;text-align:center;}

.check-list {padding-inline-start: 16px;}
.check-list li {margin-top: 2px; line-height: 20px; text-align: left; position: relative;}
::marker{font-size:6px;}

#main {background:linear-gradient(180deg, #E1F5FF 0%, #FFFFFF 100%);
  margin: 0px;padding-top: 60px;background-size:cover;background-position:center;}
#main h1{ margin-block-end: 14px;margin-top:20px;}
.main-mo {margin-bottom: -5px;}

#main .main-mo{display:block;}
#main .main-pc{display:none;}
.main-tag{padding-top:8px;padding-bottom: 8px;padding-left: 12px;padding-right: 12px;background-color: #0E3A8F;border-radius: 4px;display: inline;}

#con1{ background: #EAF4FD; padding-top: 65px;padding-bottom: 65px;}
#con1 h2{text-align: center;}
.con1-mo{display: block;padding-left: 80px;padding-right: 80px;margin-top: 28px;}
.con1-pc{display:none;}


#con2{ background: #fff; padding-top: 70px;padding-bottom: 90px;}
#con2 img{margin-left:-9px; margin-top: 40px;text-align: center;}
#con2 .container{display: none;}

#con3{ background: #f7f8f9; padding-top: 90px;padding-bottom: 120px;}


.copy_btn{background-color: #0E3A8F;color: #fff;
text-align: center;border-radius: 6px; padding-top:18px;padding-bottom: 18px;}




#con6{background: #f7f8f9; padding-bottom: 90px;padding-top: 60px;}






.sub-box { display: table-row;background: #ffffff;}
.sub-box-cell {display: table-cell;vertical-align: middle;padding-left: 24px; padding-right:14px; text-align:left;width: 400px;  height: 152px;background: #FFFFFF; box-shadow: 4px 4px 30px rgba(209, 217, 226, 0.15), 4px 0px 5px rgba(209, 217, 226, 0.25), 0px 4px 18px #D1D9E2; border-radius: 4px;}
.sub-box-cell-text {display: flex;}
.txt{margin-top: 10%; margin-bottom: 10%; width:60%; height: 100%; box-sizing: border-box;}
.img{padding-top: 2%; width:50%;}
.sub-box-cell1 {display: table-cell;vertical-align: left;padding-left: 24px; text-align:left;width: 158px;  height: 268px;background: #FFFFFF; box-shadow: 4px 4px 30px rgba(209, 217, 226, 0.15), 4px 0px 5px rgba(209, 217, 226, 0.25), 0px 4px 18px #D1D9E2; border-radius: 6px;}
.sub-box-cell2 {display: table-cell;vertical-align: right;padding-left: 24px; text-align:left;width: 158px;  height: 268px;background: #FFFFFF; box-shadow: 4px 4px 30px rgba(209, 217, 226, 0.15), 4px 0px 5px rgba(209, 217, 226, 0.25), 0px 4px 18px #D1D9E2; border-radius: 6px;}


.swiper-container { width: 100%; height: auto; margin-top: -30px;}
.swiper-wrapper{width: 100%; height: auto;  margin-left: 14px;}
.swiper-slide {text-align:left;width: 88%;display:flex;justify-content:center;margin-top: 60px;line-height: 22px;font-size: 14px;margin-left: 10px;}
.swiper-slide:nth-child(2n) {width: 88%;}
.swiper-slide:nth-child(3n) {width: 88%;margin-right:70px;}
.sw_txt {color: #28323c; text-align:left;}

.container {position: relative;margin-left: auto;margin-right: auto;padding-right: 24px;padding-left: 24px;}
.container_btn {position: relative;margin-left: auto;margin-right: auto;padding-right: 24px;padding-left: 24px;display:block;padding-top: 50px;}

.container2 {position: relative;margin-left: auto;margin-right: auto;padding-right: 0px;padding-left: 24px;}
.container3 {position: relative;margin-left: auto;margin-right: auto;padding-right: 33px; padding-left: 0px; margin-top: 80px;}
.bottom-line {
border-bottom: 1px solid #C6DCFA;
box-shadow: inset 0 -11px 0 #C6DCFA;
}


.swiper-slide-pc{display: none;}




@media (max-width: 576px) {
}

@media (max-width: 960px) {

}


@media (min-width: 960px) {

  .container_first { max-width: 100%;}
  .container {padding-left: 28%;  padding-right: 28%;}
  .container2 {  padding-left: 28%;  padding-right: 28%;}
.container_btn{padding-left: 40%;  padding-right: 40%;display: block;margin-top:60px;margin-bottom: 30px;}
  h1{font-weight: bold;}
  b1,h3{font-weight: normal;}
  h1{font-size:56px; line-height:145%; margin-block-start: 0px;}
  h2{font-size:42px; line-height:145%; margin-block-start: 8px; }
  h3{font-size:26px;line-height: 160%;color: #374553;}

  s1{font-size:30px; line-height:150%; color:#646f7c;}
  s2{font-size:30px; line-height:160%; color:#646f7c;}

  b1{font-size:26px; line-height:180%;}
  b2{font-size:20px; line-height:180%;text-align:center;}
  b3{font-size:24px; line-height:170%; color: #fff;font-weight: bold;text-align:center;}
  c1{font-size:16px; line-height:180%;}
  c2{font-size: 16px; line-height: 180%; color: #646f7c; font-weight:regular;text-align:center;}


#main {padding-top:130px;background-color: }

#main .main-mo {display:none;}
#main .main-pc{display:block;margin-top:-210px;margin-left:300px;margin-right: -150px;margin-bottom: -6px;}
#main h1 {margin-top:40px;margin-bottom: 36px;}

.main-tag{padding-top:22px;padding-bottom:14px;padding-left:22px;padding-right:22px;background-color: #0E3A8F;border-radius: 8px;display: inline;}


.swiper-container{display: none;}

#con1{padding-top: 180px;padding-bottom: 200px;margin:auto 0;text-align: center;}
#con1 h2{text-align: left;}
#con1 h3{text-align: left;margin-right: 30%;}
#con1 .container{display: flex;}


.con1-mo{display:none;}
.con1-pc{display: block;padding-left: 3%;margin-top: 10px;flex:1 1 50%;}


#con2{padding-top: 80px;padding-bottom: 80px;margin:auto 0;text-align: center;}
#con2 .container{display: block;}
#con2 img{margin-left:0;margin-top: 50px;}
#con2 h2{text-align: center;}

#con3{padding-top: 180px;padding-bottom: 200px;margin:auto 0;text-align: center;}







#con6{padding-top: 100px;padding-bottom: 120px;}



.check-list li {margin-top: 2px; line-height: 180%; text-align: left; position: relative;}







.bottom-line {border-bottom: 1px solid #C6DCFA;
box-shadow: inset 0 -15px 0 #C6DCFA;}




}