@charset "utf-8";

@import url("../css/fonts.css");
@import url("../css/nanumgothic.css");


/* Common */
*{margin:0; padding:0;}

*,*:after,*:before {-webkit-box-sizing: border-box; -moz-box-sizing: border-box;box-sizing: border-box;}
body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select{margin:0;padding:0;  }
body{font-size:0.9em;line-height:1.25em;color:#555;-webkit-text-size-adjust:none; font-family: 'NanumGothic', 'Nanum Gothic', '나눔고딕', sans-serif;  font-weight:400; -webkit-text-size-adjust:none;}
h1, h2, h3, h4, h5, h6 { font-family: 'Noto Sans KR', sans-serif; }
input,textarea,select,button,table{font-size:inherit;line-height:inherit}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button
{ -webkit-appearance: none; margin: 0;}
img,fieldset{border:0}
ul,ol{list-style:none}
em,address{font-style:normal}
a{color:#333;text-decoration:none;}
table, th, td{border:none; border-collapse:collapse;}
.hidden, legend, hr, caption{position:absolute; height:0; overflow:hidden; font-size:0; line-height:0; visibility:hidden;}

select{vertical-align:middle; border:1px solid #d3d3d3; height:50px; padding-left:5px;  -webkit-border-radius:1px;border-radius:1px; 
      -webkit-appearance:none;appearance:none; background:#fff url(../images/select-arr.gif) 95% 50% no-repeat;font-size:16px; padding-right:20px;padding-left:10px  }
select::-ms-expand { display:none}      
select:disabled {background:#eee url(../images/select-arr2.gif) 95% 50% no-repeat; }
	  
input{vertical-align:middle; border-radius:0px; border:1px solid #d3d3d3;}
input[type="radio"]{ width:20px; height:20px; border:1px solid #d3d3d3; margin:10px 0;-webkit-border-radius:1px;  } 
input[type="checkbox"]{width:20px; height:20px; border:1px solid #d3d3d3; margin:10px 0;-webkit-border-radius:1px; }
input[type="text"]{vertical-align:middle; border:1px solid #d3d3d3; text-indent:5px; padding:15px 0;  -webkit-border-radius:1px; -webkit-appearance:none; background:#f9f9f9; font-size:16px }
input[type="password"]{vertical-align:middle; border:1px solid #d3d3d3; text-indent:5px; padding:15px 0;  -webkit-border-radius:1px; -webkit-appearance:none; background:#f9f9f9;font-size:16px }
input[type="number"]{vertical-align:middle; border:1px solid #d3d3d3; text-indent:5px; padding:15px 0;  -webkit-border-radius:1px; -webkit-appearance:none; background:#f9f9f9}
input[type="date"]{vertical-align:middle; border:1px solid #d3d3d3; text-indent:5px; padding:15px 0;  -webkit-border-radius:1px; -webkit-appearance:none;background:#f9f9f9 }
input[type="tel"]{vertical-align:middle; border:1px solid #d3d3d3; text-indent:5px; padding:15px 0;   -webkit-border-radius:1px; -webkit-appearance:none;background:#f9f9f9}
input[type="file"]{vertical-align:middle; border:1px solid #d3d3d3; text-indent:5px; padding:15px 0;   -webkit-border-radius:1px; -webkit-appearance:none;background:#f9f9f9}
input:focus { background:#ebf0fa;}
input:disabled {background:#eee !important} 
textarea {  border:1px solid #d3d3d3; padding:5px; -webkit-appearance:none;  -webkit-border-radius:1px;}
textarea:disabled  { background:#efefef; border:1px solid #ccc;}

.mgb5{margin-bottom:5px}
.mgb10{margin-bottom:10px}
.mgb15{margin-bottom:15px}
.mgb20{margin-bottom:20px}
.mgb25{margin-bottom:25px}
.mgb30{margin-bottom:30px}
.mgb40{margin-bottom:40px}
.mgb50{margin-bottom:70px}
.mgb60{margin-bottom:60px}
.mgb70{margin-bottom:70px}
.mgb80{margin-bottom:80px}
.mgb90{margin-bottom:90px}
.mgb100{margin-bottom:100px}

.mgt5{margin-top:5px}
.mgt10{margin-top:10px}
.mgt15{margin-top:15px}
.mgt20{margin-top:20px}
.mgt30{margin-top:30px}
.mgt25{margin-top:25px}

.mgr5{margin-right:5px}
.mgr10{margin-right:10px}
.mgr15{margin-right:15px}
.mgr20{margin-right:20px}
.mgr25{margin-right:25px}
.mgr30{margin-right:30px}
.mgr40{margin-right:40px}
.mgr50{margin-right:50px}

.mgl5{margin-left:5px}
.mgl10{margin-left:10px}
.mgl25{margin-left:25px}
.mgl30{margin-left:30px}
.mgl50{margin-left:50px}

.pat10{padding-top:10px}
.pat15{padding-top:15px}
.pat20{padding-top:20px}
.pat30{padding-top:30px}

.cet { text-align:center}
.textR { text-align:right}

/*btn*/
button {display:inline-block; margin-bottom: 0;  text-align: center; vertical-align: middle; 
       -ms-touch-action: manipulation; touch-action: manipulation;cursor: pointer; background-image:none; border: 1px solid transparent;white-space: nowrap; padding:10px 12px; font-size:14px;
       -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

.btn {display: inline-block; margin-bottom: 0; text-align: center; vertical-align: middle; 
       -ms-touch-action: manipulation; touch-action: manipulation;cursor: pointer; background-image:none; border: 1px solid transparent;white-space: nowrap; padding:10px 12px; font-size:14px;
       -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}

.btn_basic {background:#6e6e6e; color:#FFF !important}
.btn_gree {background:#14bba9; color:#FFF !important}

.btn_sm {background:#40bbe4 ; color:#FFF !important;  padding:5px 14px;  font-size:12px;}
.btn_smnav {background:#1a304f ; color:#FFF !important;  padding:5px 14px;  font-size:12px;}

.btn_sky {background:#40bbe4 ; color:#FFF !important; width: 48.21428571428571%; padding:12px 0 !important;  font-size:13px; }
.btn_nav {background:#1a304f ; color:#FFF !important;  width: 48.21428571428571%; padding:12px 0 !important;  font-size:13px;}/*2021.04.18 new*/
.btn_blue {background:#00499c ; color:#FFF !important;  width: 48.21428571428571%; padding:12px 0 !important;  font-size:13px;}/*2021.04.18 new*/

.btn_Big {background:#0075c1 url(../images/btn_arr.png) 92% 50% no-repeat ; color:#FFF !important;  padding:14px 50px !important;  font-size:16px; border-radius: 30px; font-weight: bold; }
.btn_Big2 {background:#00499c url(../images/btn_arr.png) 92% 50% no-repeat ; color:#FFF !important; width: 48%;  padding:14px 0 !important;  font-size:14px; border-radius: 30px; font-weight: bold; }
.btn_Big3 {background:#40bbe4 url(../images/btn_arr.png) 92% 50% no-repeat ; color:#FFF !important;  width: 48%; padding:14px 0 !important;  font-size:14px; border-radius: 30px; font-weight: bold; }

.btnWrap { width: 100%;}

.btn_form { background: #0075c1; line-height: 50px; color: #fff !important; padding: 0 20px; border-radius: 8px; font-size:14px;}
.btn_form2 { background: #40bbe4; line-height: 50px; color: #fff !important; padding: 0 20px; border-radius: 8px; font-size:14px;}


.warpTop { height:407px; background:#fff url(../images/t_bg.jpg) 50% 0 no-repeat;}

.header{width: 100%; height: 50px; }
.header h1 { height: 50px;  position: absolute; left: 50%; transform: translate(-50%);}
.header h1 img { height: 100%;}

footer {  background: #ddd; clear: both;}
footer .footerWrap { width: 100%; padding: 25px 20px; font-size: 0.75rem; color: #666;}
footer .footerWrap  address { padding: 15px 0 0 10px; display:block; }

.visual { width: 100%; height: 360px;  } 
.swiper-container {width: 100%; height: 100%;  }
.swiper-slide {text-align: center;font-size: 18px;background: #fff;
    display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;
    -webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;   
}

.visual span {display: block; letter-spacing: -0.05em;}
.visual  a {display: block;  padding: 40px 24px 114px 24px; }
.visual .box01  { background: url(../images/bg01_img.png) 50% 0 no-repeat; /*background-size:contain;*/  }
.visual .box01 .boxTxt1 { width: 100%;  margin: 0 auto;  text-align: left; padding-left: 0; letter-spacing: -0.05rem;}
.visual .box01 .boxTxt1 strong { font-size: 33px;  font-weight: 600; color: #000; line-height:65px; font-family: 'Noto Sans KR', sans-serif; padding-left: 5px; }
.visual .box01 .boxTxt1 span.stt { font-size: 20px; color: #006fd1; font-weight: 600;   margin:8px 0 16px 0; line-height: 125%; padding-left: 5px;}

/*21.06.10 수정 */
.visual .box01 .boxTxt1 .stbg1 { background: #0b3399; color: #fff; font-size: 13px; line-height: 28px; padding:0 20px;  border-radius: 30px; margin-bottom: 5px; display: inline-block;}
.visual .box01 .boxTxt1 .stbg2 { background: #0092d7; color: #fff; font-size: 13px; line-height: 28px;  padding:0 20px; border-radius: 30px;  margin-bottom: 5px;   display: inline-block }

.visual .box02  { background: url(../images/bg02_img.png) 50% 0 no-repeat; /*background-size:contain;*/  }
.visual .box02 .boxTxt1 { width: 100%;  margin: 0 auto;  text-align: left; padding-left: 0; letter-spacing: -0.05rem;}
.visual .box02 .boxTxt1 strong { font-size: 33px;  font-weight: 600; color: #000; line-height:65px; font-family: 'Noto Sans KR', sans-serif; padding-left: 5px; }
.visual .box02 .boxTxt1 span.stt { font-size: 20px; color: #006fd1; font-weight: 600;  margin:8px 0 16px 0;  line-height: 125%; padding-left: 5px;}

/*21.06.10 수정 */
.visual .box02 .boxTxt1 .stbg1 { background: #1b304f; color: #fff; font-size: 13px; line-height: 28px; padding: 0 20px;  border-radius: 30px;  margin-bottom: 5px;  display: inline-block}
.visual .box02 .boxTxt1 .stbg2 { background: #0092d7; color: #fff; font-size: 13px; line-height: 28px; padding: 0 20px; border-radius: 30px;  margin-bottom: 5px;   display: inline-block}
/*21.06.10 신규 */ 
.visual .box02 .boxTxt1 .stbg3 { background: #025fd6; color: #fff; font-size: 13px; line-height: 28px; padding: 0 20px; border-radius: 30px;  margin-bottom: 5px;   display: inline-block} 

.swiper-container-horizontal>.swiper-pagination-bullets { bottom: 0 !important;}
.swiper-pagination {  text-align: left !important; padding-left: 20px;}
.swiper-pagination-bullets span {display:inline-block;}
.swiper-pagination-bullet-active { background: #001658 !important; width: 14px  !important; height: 14px  !important;}

.contWrap { width: 100%; padding:0 24px;}

.cont1 { width: 100%;  position: relative; height: 282px;}
.cont1 .cont1_in { position: absolute; width: 100%; top: -30px;}

.cont1 a { display: block; height: 84px; background: #004c9d; color: #fff; border-radius:50px; margin-bottom: 10px; padding: 16px 0 16px 100px; font-size: 14px; line-height: 22px; box-shadow: 0px 2px 8px rgb(0 0 0 / 45%);}
.cont1 a strong {  font-size:18px; display: block; font-weight: 500;}
.cont1 a:first-child {background: url(../images/mc1_bgArr.jpg) 93.5% 50% no-repeat, #004c9d url(../images/mc1_bg1.jpg) 25px 50% no-repeat;}
.cont1 a:nth-child(2) {background: url(../images/mc1_bgArr.jpg) 93.5% 50% no-repeat, #ef6016 url(../images/mc1_bg2.jpg) 25px 50% no-repeat;}
.cont1 a:last-child {background: url(../images/mc1_bgArr.jpg) 93.5% 50% no-repeat, #0090d4 url(../images/mc1_bg3.jpg) 25px 50% no-repeat;}


.cont2 { width: 100%; }
.cont2 h3 { font-size: 20px; margin-bottom: 20px; color: #111; text-align: center;}
.cont2 .inbox { width: 100%; border: 1px solid #eee; box-shadow: 0px 0px 4px rgb(0 0 0 / 12%); border-radius: 12px; padding: 20px; font-size: 14px; position: relative;} 
.cont2 .inbox h4 { font-size: 16px; padding: 8px 0; color: #004c9d; }
.cont2 .inbox ul li { font-size: 13px;  text-indent: -10px; padding-left: 10px; color: #333;}
.cont2 .inbox p { font-size: 13px; color: #333; }
.cont2 .inbox ul.st2 li { text-indent: -18px; padding-left: 18px; color: #777;}
.cont2 .inbox ul.st2 li ul li { font-size: 12px;  text-indent: -7px; padding-left: 7px; letter-spacing: -0.05rem;}
.cont2 .inbox span { display: block; width: 100%; background: #0092d7; color: #fff; font-size: 12px; border-radius: 0px  0px 12px  12px; position: absolute; bottom: 0; left: 0px; text-align: right; padding:10px 20px;}  /*21.06.14 수정 */
.cont2 .inbox .bgB { background: #004c9d;}

.cont3 { width: 100%; }
.cont3 h3 { font-size: 15px; margin-bottom: 10px; }
.cont3 ul { width: 100%;}
.cont3 ul li { font-size: 12px; text-indent: -7px; padding-left: 7px; letter-spacing: -0.03rem;}


.cont4 { background:#efefef; padding: 20px;}
.cont4 h3 { font-size: 15px; margin-bottom: 10px; color: #555; }
.cont4 h4 { font-size: 12px; margin-bottom: 10px; border: 1px solid #777;  border-radius: 30px; display: inline-block; padding: 0 10px; }
.cont4 ul { width: 100%; }
.cont4 ul li { font-size: 12px; text-indent: -7px; padding-left: 7px; letter-spacing: -0.03rem;}

@media screen and (max-width: 320px) {
       .cont1 a  { padding-left: 50px;}

   }