@font-face {
  font-family: 'GmarketSansMedium';
  src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
#service h3 {font-size:35px; font-weight:600; text-align:left; font-family: 'GmarketSansMedium'; margin: 80px 0 20px 0; line-height:40px;}
#service h3 span{position: relative; padding:0 16px 0 0; letter-spacing: -1px;}
#service h3 span:before { content: "";  width: 8px; height: 8px; background-color:#2F88EF ;  position: absolute; 
right: 0; bottom: 6px;   border-radius: 50%;}

#service {width:100%; margin:0 auto; overflow:hidden;}
#service p.txtP { padding-bottom:20px; font-size:18px;  line-height:25px; text-align: left; display: flex;}
#service p.txtP span:first-child {margin-top: -3px;}
#service p.txtP span:first-child img {padding-right: 10px;}
#service p.txtP span.txtS {font-size: 18px; line-height: 25px;}
#service .sub_txt01 { padding:0 10px;}
#service div.icoBox {overflow:hidden; margin:20px 0;}
#service section {padding:170px 35px 40px 35px; text-align:center; border:1px solid #acacac; margin:1% 1%; width:31%;
 box-sizing:border-box; min-height:320px; float:left; }
#service section.ico1 {background:url("../img/service_img01.svg")no-repeat center 40px;}
#service section.ico2 {background:url("../img/service_img02.svg")no-repeat center 40px;}
#service section.ico3 {background:url("../img/service_img03.svg")no-repeat center 40px;}
#service div.tit {font-size:20px; padding-top: 20px; font-weight: 700; text-align: left;}
#service div.txt {font-size:15px; line-height: 20px;}

#service #myVideo { position: absolute; right: 0; top: 0; border-radius:20px; width:100%; height: 320px; object-fit:cover;}

#service .backpanV { position: relative; padding: 110px 0; }  
#service .backpan {background-color: #fff; padding: 50px 0; border-radius: 30px; margin-top: 10px;}
#service .backpanV.grond1 .ground_tit {color: #fff; font-size: 24px; line-height: 32px; text-shadow: 3px 1px 11px #181f3fb3; font-family: 'GmarketSansMedium';}
#service .info_img65 img {width:65%;}
#service .info_img80 img {width:80%;}
#service .info_img90 img {width:90%;}

#service .tab_content {text-align: center; font-size:0;}
#service input[type="radio"] {display:none;}
#service input[type="radio"] + label {display:inline-block; padding:10px; color:#b1b1b1; font-size:18px; cursor:pointer; width: 33%; border-bottom: 1px solid #c6c6c6; }
#service input[type="radio"]:checked + label {color:#2F88EF; border-bottom: 3px solid #2F88EF; font-weight:600; font-size:19px;}

#service .conbox {position: relative; margin:50px auto 0 auto; display:none; font-size:18px; line-height:25px; font-weight:300;}
#service .conbox .subtitle {color: #434343; font-weight: 200;}
#service input[id="tab01"]:checked ~ .con1 {display:block;}
#service input[id="tab02"]:checked ~ .con2 {display:block;}
#service input[id="tab03"]:checked ~ .con3 {display:block;}


#service div.icoBox2 {display: flex; grid-gap: 20px; flex-wrap: wrap; margin-top: 20px; justify-content:center;}
#service div.icoBox2 p {display: flex; border:1px solid #acacac; align-items: center; padding: 10px 20px; border-radius:50px; width: 30%;}
#service div.icoBox2 p img {width: 30px; margin-right: 10px; filter:opacity(0.6) ; }

#service .flex2{display:flex; flex-wrap: wrap;  justify-content: center; align-items: center; margin-top:50px; grid-gap: 20px; }
#service .flex2 .item{  width:150px;  text-align:center; margin-bottom: 50px; position: relative;}
#service .flex2 .ico {border:1px dashed #7d8a9c; height:150px; width:150px; margin:0 auto; border-radius:50%; display: flex; align-items: center; justify-content: center; }
#service .flex2 .txt { font-size:18px;line-height: 22px; font-weight: 500; color: #4d505d;}
#service .flex2 .txt span {font-size: 16px; line-height: 12px; color: #8c8c8c; font-weight: 200;}
#service .flex2 .txt2 { font-size:18px; font-weight:500; margin-top:50px;}
/*---------------------------------------
  MOBILE RESPONSIVE              
-----------------------------------------*/
@media (max-width: 1023px) {
#service h3 {font-size:22px;  margin: 80px 0 5px 0; line-height:30px;}
#service h3 span:before { content: "";  width: 6px; height: 6px;   position: absolute; 
right: 0; bottom: 7px;   border-radius: 50%;}

#service {width:100%; }	
#service div.icoBox {padding:0 15px;}

#service p.txtP { padding-bottom:10px; }
#service p.txtP span:first-child {margin-top: -5px;}
#service p.txtP span:first-child img {padding-right: 5px;}
#service p.txtP span.txtS {font-size: 14px; line-height: 20px; width: 99%;}
#service div.txt {font-size:14px; line-height: 18px;}

#service section.ico1, #service section.ico2, #service section.ico3 {background-size: 50%;}

#service .flex2{align-items: start; grid-gap:10px;}
#service .flex2 .item{text-align:center; margin-bottom:10px; width: 130px;}
#service .flex2 .ico {width: 130px; height: 130px;}
#service .flex2 .txt { font-size:16px; font-weight:500 ; line-height:20px;}
#service .flex2 .txt2 { font-size:15px;  font-weight:500; margin-top:30px;}

#service div.tit {font-size:16px; line-height:20px;}

#service .info_img65 img {width:80%; margin-top: 10px;}
#service .info_img80 img {width:90%; margin-top: 10px;}

#service input[type="radio"] + label span {display: none;}
#service input[type="radio"] + label {font-size:14px; }
#service input[type="radio"]:checked + label {font-size:14px;}
#service .conbox {margin: 30px auto 0 auto;}
#service .conbox .subtitle {font-size: 14px; line-height: 20px;}

#service div.icoBox2 {grid-gap: 10px;}
#service div.icoBox2 p {font-size: 12px;}
#service div.icoBox2 p img {width: 20px;}
}
@media (max-width: 768px) {
#service section {padding: 90px 5px 40px 5px;}	

#service div.txt {font-size:12px; line-height: 14px;}
#service .flex2 .ico {height:150px; width:150px; background-size:35px;}
#service .flex2 .item {width: 150px; margin-bottom: 20px;}

#service .info_img65 img {width:100%; margin-top: 10px;}
#service .info_img80 img {width:100%; margin-top: 10px;}
#service .info_img90 img {width:100%; margin-top: 10px;}

#service .backpanV { padding: 80px 10px; }  
#service #myVideo {height: 280px;}
#service .backpanV.grond1 .ground_tit {font-size: 18px; line-height: 25px;}

#service div.icoBox2 p {width: 48%; padding: 3px 8px;}
#service div.icoBox2 p img {margin-right: 2px;}
}
@media (max-width: 640px) {
}
@media (max-width: 500px) {
  #service .backpanV { padding: 60px 10px; }  
}
@media (max-width: 320px) {
}

