@import url("common.css");
@font-face {
    font-family: 'GmarketSansMedium';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

#visual{position:relative; width:100%; height:540px; overflow:hidden;}

	.jssorb05 {position: absolute; top:409px; left:53% !important; margin-left:45px; z-index:999; width:auto !important}
    .jssorb05 div, .jssorb05 div:hover, .jssorb05 .av {position: relative !important;  width: 10px !important;  height: 10px; background: url('../../img/navi_off.png') center center no-repeat; cursor:pointer; margin:0 12px 0 0; padding:0; float:left; left:0px !important; }
    .jssorb05 div {  }
    .jssorb05 .av:hover { background: url('../../img/navi_on.png') no-repeat; width:22px !important; }
    .jssorb05 .av { background: url('../../img/navi_on.png') no-repeat; width:22px !important;}


#contents {clear:both; position:relative;}
.m_tit {position:Relative; font-weight:700; font-size:22px; letter-spacing:-0.5pt; line-height:100%; color:#212121}

/***** 어울림마당 / 관련자료실 / 질문과답변 *****/
.main_banner {position:relative; overflow:hidden; width:1170px; margin:0 auto; padding:60px 0; box-sizing:border-box;}
.main_banner dl {float:left; width:370px; margin-right:30px; text-align:center;}
.main_banner dl:last-child {margin-right:0}
.main_banner dl a {display:block;transition: all 0.3s ease-out;}
.main_banner dt {position:relative; overflow:hidden;}
.main_banner dt img {transition: all 0.3s ease-out;}
.main_banner dd {padding:35px 0; background:#2e4f9b; box-sizing:border-box;transition: all 0.3s ease-out;}
.main_banner dd h6.m_tit {color:#fff; margin-bottom:15px;}
.main_banner dd p {font-size:16px; letter-spacing:-0.5pt; color:rgba(255,255,255,0.6); line-height:25px;}

.main_banner dl:nth-child(2) dd {background:#fdbf50}
.main_banner dl:nth-child(2) dd h6.m_tit {color:#3b3834;}
.main_banner dl:nth-child(2) dd p {color:rgba(64,64,64,0.8);}

.main_banner dl:last-child dd {background:#355a24}

.main_banner dl a:hover {transition: all 0.3s ease-out;}
.main_banner dl a:hover dt img {-webkit-transform: scale(1.1);-moz-transform: scale(1.1); -o-transform: scale(1.1);-ms-transform: scale(1.1);transform: scale(1.1); transition: all 0.3s ease-out;}
.main_banner dl a:hover dd {background:#1f3d83; transition: all 0.3s ease-out;}
.main_banner dl:nth-child(2) a:hover dd {background:#f0b44d;}
.main_banner dl:last-child a:hover dd {background:#2d4d1f;}



/***** 공지사항 / 청소년행사 / 활동소식 *****/
.board_con {position:relative; overflow:hidden; padding:60px 0; background:#f6f6f6}
.board_in {position:relative; width:1170px; margin:0 auto}
.board_con > div {position:relative; overflow:hidden;}
.board_con > div .m_tit {margin-bottom:22px;}
.board_con > div a.more {position:absolute; top:-10px; right:0; transition: all 0.3s ease-out;}
.board_con > div a.more:hover {margin-right:5px; transition: all 0.3s ease-out;}

.board_con .board {float:left; width:560px;}
.board_con .notice {margin-right:50px;}
.board_con .board ul {padding-top:10px}
.board_con .board ul li {line-height:100%; font-size:16px; letter-spacing:-0.5pt;  }
.board_con .board ul li a {padding:15px 0;border-bottom:1px solid #ddd; box-sizing:border-box; display:block;line-height:100%; font-size:16px; letter-spacing:-0.5pt; transition: all 0.3s ease-out;}
.board_con .board ul li:first-child a {padding-top:0}
.board_con .board ul li span {float:right; line-height:100%; font-family: 'GmarketSansMedium'; color:#9f9f9f; font-size:15px;transition: all 0.3s ease-out;}

.board_con .board ul li a:hover {color:#1f1f1f;transition: all 0.3s ease-out;}
.board_con .board ul li a:hover span {color:#1f1f1f;transition: all 0.3s ease-out;}

.board_con .photo {padding-bottom: 60px; clear:both;}
.board_con .photo div {position:relative; overflow:hidden}
.board_con .photo div dl {float:left; width:270px; margin-right:30px; float:left;}
.board_con .photo div dl:last-child {margin-right:0}
.board_con .photo div dl a {display:block;transition: all 0.3s ease-out;}
.board_con .photo div dt {position:relative; overflow:hidden;transition: all 0.3s ease-out;}
.board_con .photo div dt img {transition: all 0.3s ease-out;}
.board_con .photo div dd {background:#fff; border:1px solid #ddd; border-top:none; box-sizing:Border-box; padding: 14px 12px; height:75px}
.board_con .photo div dd p {position:relative; color:#1f1f1f; font-size:16px; letter-spacing:-0.5pt; line-height:23px; font-weight:500;}
.board_con .photo div dd p img {display:none;}

.board_con .photo div dl a:hover {transition: all 0.3s ease-out;}
.board_con .photo div dl a:hover dt img {-webkit-transform: scale(1.1);-moz-transform: scale(1.1); -o-transform: scale(1.1);-ms-transform: scale(1.1);transform: scale(1.1); transition: all 0.3s ease-out;}


/***** 회사소개 *****/
.company_con {position:relative; overflow:hidden;background-color: #b4d5ec;}
.company_txtbox {width:100%;}
.ss_box {width: 70%;float: left;background-image: url("/img/youtube.png");background-position: left bottom;height: 396px;}
.ss_box2 {width: 30%;float: right;}
.company_txt {position:relative; width:1170px; margin:0 auto;padding: 37px 0 0px 0px; box-sizing:border-box;overflow: hidden;} 
.company_txt h4 {font-weight:700; font-size:40px; line-height:100%; color:#3467b3;font-family: 'GmarketSansMedium';}
.company_txt h3 {font-weight:700; font-size:40px; line-height:100%; color:#cc1919; font-family: 'GmarketSansMedium';}
.company_txt p {font-size:16px; letter-spacing:-0.5pt; color:#33395c; line-height:25px; margin:20px 0 30px 0}
.company_txt a {display:block;border:1px solid #3f51b5; width:143px; line-height:50px; text-align:center; color:#33395c; transition: all 0.3s ease-out;} 
.company_txt a:hover { background:#3f51b5; color:#fff; transition: all 0.3s ease-out;}
.you_bt {padding:10px; background-color:#cc1919; color:#fff; text-align:center; width:120px;}
.ss_box p {color:#fff;margin: 277px auto 0 280px;}