@import url('https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css');
@font-face {
    font-family: 'KyoboHandwriting2020A';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2112@1.0/KyoboHandwriting2020A.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.form_txt {padding-bottom:15px}
.form_btn a {display:block; padding:20px; border-radius:5px; background:#222; color:#fff; width:200px; margin:0 auto;
font-size:18px}

#contentWrap #content #contentsArea   {font-size:16px; color:#333; /* font-family:"nanumsquare","sans-serif"; transform: skew(-0.1deg); */ }
#contentsArea p { padding-bottom:20px;  }
#contentsArea .board_description p{padding-bottom:0;}
#contentWrap #content #contentsArea ul {/*clear:both;*/ overflow:hidden;}
.col2 {width:50%; float:left; position:relative;  text-align:center;}
.col3 {width:33.33333%; float:left; position:relative; text-align:center;}
.col4 {width:25%; float:left; position:relative; text-align:center; }
.col5 {width:20%; float:left; position:relative; text-align:center;}

.line {border-top:1px solid #dfdfdf;}
.line2 {border-top:2px dashed #dfdfdf;}
.lineBd {border-bottom:1px dashed #888;}
.dotline {border-top:2px dashed #aaa; margin:100px 0;}
.boxLine {border:1px solid #ccc; }
a.btn01 {display:block; padding:8px 30px; width:180px; margin:0 auto; background-color:#244cbb; color:#fff; font-family:"Noto Sans KR","Dotum","Gulim,Helvetica","sans-serif"; }

.product table.table_05 > tbody > tr > td > table {border:1px solid #d2d2d2 !important; width:310px !important;}
.product table.table_05 > tbody > tr > td > table:hover {border:1px solid #d35b13 !important;}
.product table.table_05 .gallery_title,.product table.table_05  .gallery_cont,
.product table.table_05 .gallery_etc font,
.product table.table_05 .gallery_subject {font-size:13px !important; text-align:left !important;
font-family:"Noto Sans KR","Dotum","Gulim,Helvetica","sans-serif"; }
.product table.table_05 .gallery_title {font-size:16px !important; color:#d35b13; font-weight:500; padding-top:0}
.product table.table_05 .gallery_subject {padding:5px 20px 10px 20px}
.product table.table_05 .gallery_subject br {display:none;}
.product table.table_05 > tbody > tr > td > table .gallery_etc{border-top:1px solid #d2d2d2 !important; padding:10px 8px;
text-align:left !important; }
.product table.table_05 .gallery_etc {color:#fff; position:relative;}
.product table.table_05 .gallery_etc span{display:none;}
.product table.table_05 .gallery_etc font {position:relative;  color:#777 !important;}
.product table.table_05 .gallery_etc font:before {content:""; position:absolute; top:0; left:0; width:10px; height:20px;
background-color:#fff;}
/*.product table.table_05 .gallery_etc:after {content:"자세히보기"; position:absolute; top:0; right:0; width:100px; height:25px;
background-color:#000;}*/

/*bullet css*/
.bullet01 {font-size:25px; font-weight:500; padding:0 0 20px 16px; position:relative; }
.bullet01::before {content:""; height:21px; width:4px; background-color:#555; position:absolute; top:4px;  left:0px; }
.bullet02 {font-size:18px; position:relative; padding-left:13px; margin-bottom:5px; }
.bullet02:before { content: "";  width: 4px; height: 4px; background-color: #555;  position: absolute; left: 0; top: 12px;   border-radius: 50%;}
.bullet03 {font-size:18px; position:relative; margin-bottom:20px; padding-top:3px;}
.bullet03:before { content: "";  width: 38px; height: 3px; background-color: #333;  position: absolute; left: 0; top: 0px;   }
.bullet04 {font-size:18px; position:relative; margin-bottom:20px; padding-left:18px;}
.bullet04:before { content: "";  width: 3px; height: 25px; background-color: #244db7;  position: absolute; left: 0; top: 7px;   }
.bullet05 {font-size:42px; position:relative; padding-bottom:60px; }
.bullet05:before { content: "";  width: 1px; height: 30px; background-color: #244db7;  position: absolute; left: 50%; bottom: 18px;   }
.bullet06{font-size:26px; position:relative;  padding:20px 0 45px 0; color:#666; font-weight:400}
.bullet06:before { content: "";  width: 50px; height: 1px; background-color: #244db7;  position: absolute; left:0; bottom: 23px;   }
.bullet07 {    display: inline-block;   position: relative;   padding: 0 0 0 25px;   font-size: 30px;   font-weight: 500;
    color: #444444;    letter-spacing: -.03em;    line-height: 1.4em;}
.bullet07:before  {    position: absolute;    top: 5px;    left: 5px;    display: block;    content: '';    width: 10px;
    height: 14px;    background: #3a6fcf;    -webkit-transform: skew(-15deg);    transform: skew(-25deg);    -webkit-box-shadow: 4px 4px 0 0 rgb(0 0 0 / 10%);    box-shadow: 4px 4px 0 0 rgb(0 0 0 / 10%);}  
   
.ico li{background:url(bullet/ico1.jpg)no-repeat left 8px;  padding:8px 0 8px 40px;}
.ico2 li{background:url(bullet/ico2.jpg)no-repeat 95% center;  padding:8px 0 8px 40px;}

/*txt css*/
.txtH20 {font-size:20px; line-height:32px;}
.txtH22 {font-size:22px; line-height:34px;}
.txtH24 {font-size:24px; line-height:34px;}
.txtH25 {font-size:25px; line-height:35px;}
.txtH26 {font-size:26px; line-height:36px;}
.txtH28 {font-size:28px; line-height:38px;}
.txtH30 {font-size:30px; line-height:42px;}
.txtH35 {font-size:35px; line-height:48px;}
.txtH38 {font-size:38px; line-height:48px;}
.txtH40 {font-size:40px; line-height:54px;}
.txtH45 {font-size:45px; line-height:58px;}
.txtH50 {font-size:50px; line-height:64px;}
.txtC12 { font-size:12px; line-height:18px; }
.txtC13 { font-size:13px; line-height:18px; }
.txtC14 { font-size:14px; line-height:22px; }
.txtC15 { font-size:15px; line-height:22px; }
.txtC16 { font-size:16px; line-height:23px; }
.txtC18 { font-size:18px; line-height:28px; }
.txtC20 { font-size:20px; line-height:30px; }
.txtBold1 {font-weight:500; }
.txtBold2 {font-weight:600; }
.txtLineB {border-bottom:1px solid #234eba;}
.img {vertical-align:top; max-width:100%;}

/* menu 3depth */
div.depth3 {padding:35px 0 35px 0; width:100%; margin:0 auto 10px auto;}
div.depth3 ul {overflow:hidden;border-left:1px solid #dfdfdf; border-top:1px solid #dfdfdf; }
div.depth3 ul li { float:left; width:25%; }
div.depth3 ul li a{ display:block;text-align:center; border-right:1px solid #dfdfdf;
border-bottom:1px solid #dfdfdf; box-sizing:border-box;padding:13px 10px; background-color:#fff; font-size:16px;}
div.depth3 ul li:last-child a {border-right:1px solid #dfdfdf;}
div.depth3 ul li.dep3_on a{background-color:#07549c; color:#fff;}
div.depth3 ul li:first-child:nth-last-child(2),div.depth3 ul li:first-child:nth-last-child(2)+li {  width: 50%; }    
div.depth3 ul li:first-child:nth-last-child(3),div.depth3 ul li:first-child:nth-last-child(3)~li { width: 33.33333%; } 

div.depBox {background-color:#f8f8f8; width:100%; border-bottom:1px solid #e4e4e4; overflow:hidden;} 
div.depth3s {padding:85px 0 0px 0; width:780px; margin:0 auto -1px auto;}
div.depth3s ul {overflow:hidden;border-left:1px solid #e4e4e4; border-top:1px solid #e4e4e4; }
div.depth3s ul li { float:left; width:25% }
div.depth3s ul li a{ display:block;text-align:center; border-right:1px solid #e4e4e4; width:100%;
border-bottom:1px solid #e4e4e4; box-sizing:border-box;padding:13px 10px; background-color:#f8f8f8; font-size:16px;}
div.depth3s ul li.dep3_on a{background-color:#fff; color:#d45b14;}

/*flex*/
.flex1{display:flex; flex-wrap: wrap; justify-content: flex-start; align-content: flex-start;}
.flex1 div.col3 { width:31.333333%; margin:0 2% 2% 0 ; }
.flex1 div img {max-width:100%; vertical-align:top;}

/*Add css*/
.bgBlue {padding:0 10px;}
.bgBlue2 {background-color:#e5edff}
.box01 {padding:30px;  }
.block {display:block;}

/*---------------------------------------
  MOBILE RESPONSIVE              
-----------------------------------------*/
@media (max-width: 1023px) {
.product table.table_05 > tbody > tr > td > table {border:1px solid #d2d2d2 !important; width:95% !important;}	
.product table.table_05 .gallery_subject {padding:1px 10px 5px 10px}
.product table.table_05 .gallery_title {font-size:14px !important; color:#d35b13; font-weight:500; padding-top:0}
.product table.table_05 > tbody > tr > td > table .gallery_etc{ padding:5px 0px;}
.hiddenM {display:none !important;}	
.txtP { font-size:16px; line-height:26px; padding-bottom:20px;  }	
.col2 {width:100%; float:left; position:relative;}
.col3 {width:100%; float:left; position:relative;}
.col4 {width:48%; float:left; position:relative; margin:0 1%;}
.col5 {width:50%; float:left; position:relative;}	
.form_txt {padding-bottom:10px; font-size:14px}
.dotline {border-top:2px dashed #aaa; margin:50px 0;}
.box01 {padding:20px;  }
.bullet04:before { content: "";  width: 3px; height: 20px; background-color: #244db7;  position: absolute; left: 0; top: 2px;   }
 .ico li{background:url(bullet/ico1.jpg)no-repeat left 8px;  padding:8px 0 8px 40px;}

/*bullet css*/
.bullet05 {font-size:25px;}
.bullet06 {font-size:20px;}
.bullet06:before {  left:50%; bottom: 23px; transform:translate(-50%,0);}

.ico2 li{background:url(bullet/ico2.jpg)no-repeat 95% center;  padding:8px 0 8px 0px;}

/*txt css*/
.txtH20 {font-size:15px; line-height:24px;}
.txtH22 {font-size:15px; line-height:24px;}
.txtH24 {font-size:16px; line-height:24px;}
.txtH25 {font-size:16px; line-height:25px;}
.txtH26 {font-size:20px; line-height:25px;}
.txtH28 {font-size:20px; line-height:25px;}
.txtH30 {font-size:22px; line-height:28px;}
.txtH35 {font-size:25px; line-height:28px;}
.txtH40 {font-size:30px; line-height:38px;}
.txtH45 {font-size:30px; line-height:38px;}
.txtH50 {font-size:40px; line-height:45px;}
.txtC12 { font-size:12px; line-height:18px; }
.txtC13 { font-size:12px; line-height:18px; }
.txtC14 { font-size:12px; line-height:18px; }
.txtC15 { font-size:12px; line-height:18px; }
.txtC16 { font-size:13px; line-height:24px; }
.txtC18 { font-size:14px; line-height:22px; }
.txtC20 { font-size:14px; line-height:22px; }

/*3depth*/
div.depth3 {padding:10px 0; margin: 0 0 20px 0;  width:100%;}
div.depth3 ul {border-bottom:0;}
div.depth3 ul,#dev1 ul {  width:100% !important}
div.depth3 ul li {padding: 0; font-size:14px;  }

div.depBox, 
div.depth3s {display:none}

/*flex*/
.flex1 {display:flex; flex-flow: row wrap; justify-content: space-between;}	
.flex1 div.col3 {flex: 1 1 40%;margin-right:0;   }
.flex1 div.col3 img{width:95%;}

}
@media (max-width: 768px) {
}
@media (max-width: 640px) {
}
@media (max-width: 480px) {
}
@media (max-width: 320px) {
}