@charset "utf-8";
/* sub2 창작 활동 홍보 페이지*/
/* 초기화 */
body, header, div, nav, article, input, section, footer, h1, h2, h3, h4, hr, ul,li,p,dl,dt,dd { margin: 0; padding: 0; }
.hidden { display: none;}
input{ border-style: none; }
ul, li { list-style: none; }
a { text-decoration: none; }

/* header 영역 */
header{ height: 76px; }
header div#header_area{ height: 26px; padding: 0 19px;}
header div#header_area a{ display: block; width: 100%; height: 100%; }
header div#header_area h1{ width: 184px; height: 26px; background:url(../img/logo.png) no-repeat; background-size: contain; float: left; text-indent: -9999px; margin-top: 27px; }
header div#header_area div#header_wrap{ width:781px; height:26px; float:right;}
header div#header_area div#header_wrap nav{ width: 726px; float: left; margin-top: 27px; }
header div#header_area div#header_wrap nav li{ font-size: 13px; height: 26px; line-height: 18px; float: left; margin-left:20px; font-weight: bold; }
header div#header_area div#header_wrap nav li:nth-child(2) a{ color: #2a7bec; }
header div#header_area div#header_wrap nav li:hover a{ color : #2a7bec; }
header div#header_area div#header_wrap nav li a{ color: #000; }
header div#header_area div#header_wrap div.search { width: 26px; float:right; }
header div#header_area div#header_wrap div.search input[type="image"]{ float:left; height:18px; }

/* article 영역 */
article{height:640px; background: url(../img/ssup_visual.jpg) no-repeat; background-size : cover; margin-bottom: 48px; }
article div.article_title{padding-top:158px;}
article div.article_title h1{font-weight:bold; font-size:52px; color:#fff; text-align:center;}
article div.article_title p{line-height:25px; color:#fff; text-align:center; font-weight: bold; margin-top: 40px; }
article div.article_box{ width:182px; height: 50px; border-radius: 3px; background:#fff; margin: 0px auto; line-height: 50px; text-align: center; margin-top: 70px; font-weight: bold; }
article div.article_box a { color: black; }
article div.article_box a:hover { color : #657bec; }
/* section 영역 */
section { height: 1644px; }

/* wrap 영역 */
section > div#wrap { width : 1444px; height: 1433px;  margin: 0px auto; }

/* content1 영역 */
section > div#wrap > div.contents1 { width : 1213px; height: 600px; margin: 0px auto; margin-bottom: 112px; }
section > div#wrap > div.contents1 img { width : 584px; height: 600px; float: left; }
section > div#wrap > div.contents1 div.box1 { width: 100px; height: 100px; position: relative; top: -10px; left: -120px; background: yellow; text-align: center; font-size: 22px; font-weight: bold; display: block; overflow:hidden; line-height:100px;}

section > div#wrap > div.contents1 > div.contents1_area { width: 600px; height: 200px; position: relative; float: right; top : 50px; }
section > div#wrap > div.contents1 > div.contents1_area h4 { font-size: 14px; color: #2a7bec; }
section > div#wrap > div.contents1 > div.contents1_area h2 { font-size: 22px; font-weight: bold; padding-top : 20px; }
section > div#wrap > div.contents1 > div.contents1_area h2 a { color : #000; }
section > div#wrap > div.contents1 > div.contents1_area h2:hover a { color: #2a7bec; text-decoration: underline; }
section > div#wrap > div.contents1 > div.contents1_area p { font-size: 14px; padding-top : 45px; line-height: 25px; }

section > div#wrap > div.contents1 > div.contents1_area > div.view7 { width: 140px; height: 46px; border : 1px solid #2a7bec; border-radius: 5px 5px 5px 5px; background : #2a7bec; position : relative; bottom: -80px; line-height: 45px; text-align: center;  }
section > div#wrap > div.contents1 > div.contents1_area > div.view7:hover { background : #1c5db8; }
section > div#wrap > div.contents1 > div.contents1_area > div.view7 a { color : white; }

/* content2 영역 */
div.contents2{width:1444px; height:640px; margin:0 auto; }
div.contents2 h3{font-size:30px; text-align:center; }
div.contents2 h4{font-size:17px; text-align:center; color:#494455}
div.contents2 > div.contents_list{ float:left; margin-top:66px; }
div.contents2 > div.contents_list dl{float:left; margin-left:28px;}
div.contents2 > div.contents_list dl:first-child{margin-left:0;}
div.contents2 > div.contents_list dt{width:338px; height:338px; margin-bottom:25px; text-indent:-9999px;}

div.contents2 > div.contents_list dt{width:338px; height:338px; margin-bottom:25px; text-indent:-9999px; overflow: hidden; }
div.contents2 > div.contents_list dl:nth-child(1) dt{ background:url(../img/1_1610416899.png) no-repeat center; background-size: 100% 100%; }
div.contents2 > div.contents_list dl:nth-child(1):hover dt{ background-size: 120% 120%; transition : all 1s; }

div.contents2 > div.contents_list dl:nth-child(2) dt{background:url(../img/1_1610418343.png) no-repeat center; background-size: 100% 100%; }
div.contents2 > div.contents_list dl:nth-child(2):hover dt{ background-size: 120% 120%; transition : all 1s; }

div.contents2 > div.contents_list dl:nth-child(3) dt{background:url(../img/1_1610328858.png) no-repeat center; background-size: 100% 100%; }
div.contents2 > div.contents_list dl:nth-child(3):hover dt{ background-size: 120% 120%; transition : all 1s; }

div.contents2 > div.contents_list dl:nth-child(4) dt{background:url(../img/1_1608100651.png) no-repeat center; background-size: 100% 100%; }
div.contents2 > div.contents_list dl:nth-child(4):hover dt{ background-size: 120% 120%; transition : all 1s; }

div.contents2 > div.contents_list dl dd{font-weight:bold; margin-top:13px;font-size:9px; }
div.contents2 > div.contents_list dl dd span{color:#657bec; margin-top:25px;}
div.contents2 > div.contents_list dl dd:nth-child(3){font-size:17px;}
div.contents2 > div.contents_list dl dd:last-child{margin-top:33px; color:gray; font-weight:normal;}

/* content3 영역 */
div.contents3 { height: 172px; background: #f5f5f5; margin-bottom : 0px;  }
div.contents3_area { width : 1444px; height: 165px; margin: 0px auto; } 
div.contents3_area h2 { padding-top : 70px; font-size : 24px; } 

div.contents3_area > div.past { width: 162px; height: 48px; border : 1px solid #2a7bec; border-radius: 5px 5px 5px 5px; background : #2a7bec; position : relative; bottom: -100px; line-height: 45px; text-align: center; float : right; top : -35px; }
div.contents3_area > div.past a { color : white; font-weight: bold; font-size : 14px;  }
div.contents3_area > div.past:hover { background : #1c5db8; }

/* footer 영역 */
div.footer { background : #1a6ad9; }
footer { width : 1447px;  height : 239px; background : #1a6ad9; margin : 0px auto; padding-top: 43px; }
footer h1 { width: 211px; height : 53px; background : url(../img/logo_bottom.png) no-repeat; background-size : 100%; text-indent: -9999px; }
footer small { width: 159px; height : 23px; text-transform: uppercase; position : relative; top : 100px; left : -840px; color : white; font-weight: bold; font-size : 12px; }
footer dl {  position : relative; top : -70px; left : 350px;float : left; padding-right : 140px; font-size : 13px; font-weight: bold; }
footer dl:last-child { padding-right : 0px; }
footer dl dt { padding-bottom: 15px; }
footer dl.t1 { padding-right : 40px; }
footer dl dt.t2 { color : #1a6ad9; }
footer dl dd { padding-bottom: 15px; color: white; }
footer dl dt a { color : #e9ef18; }
footer dl dd a { color : white; }