/*---- content ----*/
.content {margin-top:200px; opacity: 0;}
#content {width:1200px; padding:150px 0 100px 0; margin:30px auto;}
#content dl {width:100%; overflow: hidden;}

#content dt {width:800px; height:200px; overflow: hidden; margin-top:30px; text-align: center; margin:auto;}
#content dt h1{font-size:25px; margin-bottom:10px;}
#content dt h2{font-size:15px; margin-top:0; margin-bottom:30px; color:#616e76}
#content dt h3{font-size:15px; line-height: 30px;}
#content dd {width:100%; text-align: center;}
#content dd img {width:90%; max-width:800px;}

/*---- main ----*/
#main {width:100%; min-width:1200px; padding:60px 0; background:#f5f5f5}
#main>h2 {text-align: center; font-size:15px; color:#666; line-height: 25px; margin-top:20px;}
#main>h1 {text-align: center; font-size:25px; margin-top:30px;}
.main_2 {width:1200px; margin:auto; margin-top:100px;}
.main_2 dl {width:100%; margin:100px 0; overflow: hidden; padding:30px;}
.main_2 dl dt {float:left; overflow: hidden; margin-right:30px; box-shadow: 0 0 30px rgba(0,0,0,0.3); width:400px;}
.main_2 dl dt img {width:100%;}
.main_2 dl dd {width:1000px; font-size:15px; line-height: 25px; margin:0; color:#666; margin-top:50px;}
.main_2 dl dd h1 {font-size:20px; line-height: 25px; margin-bottom:20px;}
.main_2 dl dd h2 {font-size:15px; line-height: 25px; margin:0; color:#666;}
.main_2 dl dt img {width:400px;}
.main_2 dl:nth-child(2) dt {float:right;}
.main_2 dl:nth-child(2) dd {width:600px; margin-top:50px; margin-left:80px;}

/*---- main3 ----*/
#main3 {width:100%; min-width:1200px; padding:80px 0 150px 0; margin:auto; overflow: hidden;}
.main3_3 {width:1200px; margin:auto;}
#main3 h1 {text-align: center; font-size:25px; margin-top:0; margin-bottom:50px;}
#main3 dl {width:370px;float:left; margin-right:40px;}
#main3 dl:last-child {margin-right:0;}

#main3 dl dt {text-align: center;}
#main3 dl dt img {width:70px;}
#main3 dl dd:first-of-type {font-size:20px; font-family: "nanumL"; margin-bottom:20px; margin-top:30px; text-align: center;}
#main3 dl dd {font-size:14px; margin-left:0; line-height: 25px;}

/*---- tablet ----*/
@media (min-width:601px) and (max-width:1199px) {
    
    #content {width:100%; min-width:300px; padding:100px 0;}
    #content dl {width:90%; height:100%; padding:0; margin:auto;}
    #content dl dt {width:100%; text-align: center; height:100%; margin:30px 0;}
    #content dl dt h1 {font-size:20px;}
    #content dl dt h2 {font-size:14px;}
    #content dl dt h3 {font-size:14px;}
    #content dl dd {width:80%; float:none; margin:auto;}
    
     #main {width:calc(100% - 20px); min-width:300px; padding:10px;}
    #main>h1 {font-size:20px; margin-top:50px;}
    #main>h2 {font-size:14px;}

    .main_2 {width:100%; margin-top:0px;}
    .main_2 dl {padding:0;}
    .main_2 dl dt {float:none; margin:auto; width:400px;}
    .main_2 dl dt img {width:100%;}
    .main_2 dl dd {width:90%; margin:auto; text-align: center; margin-top:30px;}
    .main_2 dl dd h1 {font-size:18px; text-align: center;}
    .main_2 dl dd h2 {font-size:14px;}
    
    .main_2 dl:nth-child(1) {margin-top:50px;}
    .main_2 dl:nth-child(2) dt {float:none;}
    .main_2 dl:nth-child(2) dd {margin:auto; margin-top:30px;}
    
    #main3 {min-width:300px;  padding:50px 0;}
    #main3 h1 {font-size:20px;}
    #main3 dl {width:90%; margin-bottom:30px; margin:auto; text-align: center; float:none; margin-bottom:50px;}
    #main3 dl:last-child {margin-right:auto;}
    #main3 dl dd:first-of-type {font-size:18px;}
    #main3 dl dd {font-size:14px;}
    .main3_3 {padding:10px; width:calc(100% - 20px);}
    
}

/*---- mobile ----*/
@media(max-width:600px){
    
    #content {width:100%; min-width:300px; padding:50px 0;}
    #content dl {width:90%; height:100%; padding:0; margin:auto;}
    #content dl dt {width:100%; text-align: center; height:100%; margin:30px 0;}
    #content dl dt h1 {font-size:20px;}
    #content dl dt h2 {font-size:13px;}
    #content dl dt h3 {font-size:13px;}
    #content dl dd {width:100%; float:none; margin:auto; box-shadow: none;}
    
    #main {width:calc(100% - 40px); min-width:300px; padding:20px;}
    #main>h1 {font-size:20px; margin-top:50px;}
    #main>h2 {font-size:13px;}

    .main_2 {width:100%; margin-top:0px;}
    .main_2 dl {padding:0;}
    .main_2 dl dt {float:none; box-shadow: none; margin:auto; width:100%;}
    .main_2 dl dt img {width:100%;}
    .main_2 dl dd {width:100%;}
    .main_2 dl dd h1 {font-size:18px; text-align: center;}
    .main_2 dl dd h2 {font-size:13px;}
    
    .main_2 dl:nth-child(1) {margin-top:50px;}
    .main_2 dl:nth-child(2) dt {float:none;}
    .main_2 dl:nth-child(2) dd {width:100%; margin:0; margin-top:50px;}
    
    #main3 {min-width:300px;  padding:50px 0;}
    #main3 h1 {font-size:20px;}
    #main3 dl {width:100%; margin-bottom:30px;}
    #main3 dl:first-of-type {font-size:18px;}
    #main3 dl dd {font-size:13px;}
    .main3_3 {padding:20px; width:calc(100% - 40px);}
    
}