@charset "utf-8";

ul, li, dl, dt, dd {
    margin: 0;
    padding: 0;
    list-style: none;
}

/* 내용관리 */
.metal_img {display:block;position:relative;width:100%;max-width:1000px;margin:0 auto 30px auto;}
.metal_img img {width:100%;height:auto;}

/* .metal_con {position:relative;width:100%;max-width:1000px;margin:0 auto;font-size:15px;line-height:24px;}
.metal_con h3 {display:block;margin:0 0 80px 0;color:#222;font-size:30px;font-weight:500;text-align:center;letter-spacing:-1px;}
.metal_con h3 strong {display:block;font-size:48px;}
.metal_con h4 {display:block;margin:0 0 24px 0;font-size:24px;font-weight:500;}
.metal_con h5 {display:block;margin:0 0 12px 0;font-size:18px;font-weight:500;}
.metal_con h6 {display:block;margin:0 0 12px 0;font-size:16px;font-weight:500;}
.metal_con strong {display:block;margin:0 0 8px 0;font-size:18px;font-weight:400;}
.metal_con .metal_title {display:block;margin:0 0 36px 0;color:#222;font-size:30px;font-weight:500;letter-spacing:-1px;}
.metal_con a {color:#222;} */

#ctt {
    width:100%;
    max-width:1280px;
    margin: 0 auto;
    padding:5%;
    border:1px solid #ccc;
}
.ctt_admin {display: none;}
.ctt_work_adm { text-align: right; }
#ctt header h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#ctt_con {
    width:100%;
    /* max-width:980px; */
    margin:0 auto;
    line-height:1.6em;
    background:#fff;
    padding:5%;
    font-size: 16px;
}
/* #ctt_con img{max-width:100%;height:auto} */
.ctt_img {text-align:center}
ul.daboseong-history {
    padding-left: 20px;
}
ul.daboseong-history li {
    position: relative;
    list-style: none !important;
    padding-left:160px;
}
ul.daboseong-history li:hover {
    background:#efefef;
    color: #212286;
}
ul.daboseong-history li strong {
    position: absolute;
    top:0px;
    left:0px;
}

/* 내용관리 */
#ctt {}
.ctt_admin {text-align:right}
#ctt header h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#ctt_con {}

.metal_img {display:block;position:relative;width:100%;max-width:1000px;margin:0 auto 30px auto;}
.metal_img img {width:100%;height:auto;}

.metal_con {position:relative;width:100%;max-width:1000px;margin:0 auto;font-size:15px;line-height:24px;}
.metal_con h3 {display:block;margin:0 0 80px 0;color:#222;font-size:30px;font-weight:500;text-align:center;letter-spacing:-1px;}
.metal_con h3 strong {display:block;font-size:48px;}
.metal_con h4 {display:block;margin:0 0 24px 0;font-size:24px;font-weight:500;}
.metal_con h5 {display:block;margin:0 0 12px 0;font-size:18px;font-weight:500;}
.metal_con h6 {display:block;margin:0 0 12px 0;font-size:16px;font-weight:500;}
.metal_con strong {display:block;margin:0 0 8px 0;font-size:18px;font-weight:400;}
.metal_con .metal_title {display:block;margin:0 0 36px 0;color:#222;font-size:30px;font-weight:500;letter-spacing:-1px;}
.metal_con a {color:#222;}

/*.about_img {display:block;position:relative;height:500px;background:url(../../../img/about_img.jpg) no-repeat 50% 50%;background-size:cover;}
.about_img h3 {display:block;position:absolute;left:0;top:50%;width:100%;padding:0 40px;color:#fff;font-size:30px;font-weight:500;text-align:center;letter-spacing:-1px;
-webkit-transform: translateY(-90%);
-ms-transform: translateY(-90%);
transform: translateY(-90%);
}
.about_img h3 strong {display:block;font-size:48px;}*/
.intro {position:relative;width:100%;max-width:1000px;margin:0 auto;font-size:14px;;word-break:keep-all;}
.intro h3 {display:block;margin:0 0 12px 0;color:#222;font-size:24px;font-weight:400;}
.intro h4 {display:block;margin:0 0 12px 0;color:#222;font-size:18px;font-weight:400;}
.intro p {margin:0 0 36px 0;}
.intro ul.history {}
.intro ul.history li {display:block;position:relative;margin:0 0 8px 0;padding:0 0 0 160px;font-size:14px;}
.intro ul.history li strong {display:block;position:absolute;left:0;top:0;font-family:'Lato';color:#434f5f;font-size:15px;font-weight:700;}

.about_con {position:relative;width:100%;max-width:1280px;margin:0 auto;font-size:16px;text-align:center;word-break:keep-all;}
.about_con h3 {display:block;margin:0 0 36px 0;font-size:36px;font-weight:400;}
.about_con h4 {display:block;margin:0 0 12px 0;font-size:24px;font-weight:400;}
.about_con span {display:block;}
.about_con .img {margin:0 0 36px 0;}
.about_con .img img {width:100%;height:auto;}


.contact {width:100%;max-width:1280px;margin:0 auto 20px auto;;padding:0 40px;}
.contact .img {margin:0 0 60px 0;}
.contact .img img {width:100%;height:auto;}
.contact h3 {display:block;color:#222;font-size:16px;font-weight:400;}
.contact p {margin:0 0 40px 0;font-size:18px;}
.contact ul {margin:0 0 80px 0;}
.contact ul:after {display:block;visibility:hidden;clear:both;content:""}
.contact ul li {display:block;float:left;width:30%;margin:0 5% 0 0;font-size:18px;}
.contact ul li:last-child {margin:0;}
.contact ul li strong {display:block;color:#222;margin:0 0 6px 0;padding:0 0 6px 0;font-size:16px;font-weight:400;border-bottom:solid 1px #ddd;}
.contact ul li strong i {font-size:20px;}

.contact_traffic {width:100%;max-width:1000px;margin:0 auto 60px auto;padding:0 40px;}
.contact_traffic ul {margin:0 0 48px 0;}
.contact_traffic ul:after {display:block;visibility:hidden;clear:both;content:""}
.contact_traffic ul li {display:block;position:relative;min-height:120px;margin:0 0 24px 0;padding:0 0 24px 140px;line-height:30px;border-bottom:solid 1px #ddd;}
.contact_traffic ul li:last-child {margin:0;padding:0 0 0 140px;border-bottom:none}
.contact_traffic ul li strong {display:block;position:absolute;left:40px;top:0;width:80px;height:80px;padding:16px 0 0 0;font-weight:400;text-align:center;background:#eee;border-radius:50%;}
.contact_traffic ul li strong i {display:block;font-size:36px;}
.contact_traffic ul li strong p {font-weight:400;text-align:center;}
.contact_traffic ul li span {display:inline-block;margin:0 8px 0 0;padding:2px 8px;color:#fff;font-size:13px;line-height:normal;border-radius:3px;}
.contact_traffic ul li span.blue {background:#044ea3;}
.contact_traffic ul li span.red {background:#f00001}
.contact_traffic ul li span.orange {background:#ff7700}
.contact_traffic ul li span.green {background:#39b54a;}

.map {position:relative;margin:0 0 80px 0;}

.useinfo {width:1000px;margin:0 auto;}
.useinfo h2 {display:block;margin:0 0 12px 0;color:#222;font-size:18px;font-weight:500;}
.useinfo h3 {display:block;margin:0 0 8px 0;color:#222;font-size:16px;font-weight:500;}
.useinfo b {font-weight:500;}

.privacy {width:100%;max-width:1000px;margin:0 auto;}
.privacy h3 {display:block;margin:0 0 36px 0;color:#222;font-size:24px;font-weight:500;}
.privacy strong {display:block;margin:0 0 8px 0;color:#222;font-size:16px;font-weight:500;}

.rule {width:1000px;margin:0 auto;line-height:26px;}
.rule h2 {display:block;margin:0 0 12px 0;color:#222;font-size:18px;font-weight:500;}
.rule h3 {display:block;margin:0 0 8px 0;color:#222;font-size:16px;font-weight:400;}

.greeting {width:100%;max-width:1000px;margin:0 auto 40px auto;padding:0 40px 40px 40px;border-bottom:solid 1px #ddd;}
.greeting:after {display:block;visibility:hidden;clear:both;content:""}
.greeting p {text-align:center !important; line-height:24px;}
.greeting p span {display:block;}
.greeting p strong {color:#222;font-weight:500;}

.greeting .box {float:left;}
.greeting .box_img {width:40%;}
.greeting .box_con {width:60%;}
.greeting .box img {width:100%;max-width:300px;height:auto;margin:0 0 20px;}
.greeting .box .sign {font-size:16px;}
.greeting .box .sign strong {display:block;color:#222;font-size:18px;font-weight:400;}
.greeting .box h3 {display:block;position:relative;margin:0 0 18px 0;padding:0 0 0 12px;color:#222;font-size:24px;font-weight:500;}
.greeting .box h3 .bullet {display:block;position:absolute;width:5px;height:5px;left:0;top:16px;background:#434f5f;border-radius:50%;}

.greeting .box ul.history {}
.greeting .box ul.history li {display:block;position:relative;margin:0 0 8px 0;padding:0 0 0 160px;font-size:15px;}
.greeting .box ul.history li strong {display:block;position:absolute;left:0;top:0;font-family:'Lato';color:#434f5f;font-size:16px;font-weight:700;}

.greeting .box ul.history2 {}
.greeting .box ul.history2 li {display:block;position:relative;margin:0 0 8px 0;padding:0 0 0 80px;font-size:15px;}
.greeting .box ul.history2 li strong {display:block;position:absolute;left:0;top:0;font-family:'Lato';color:#434f5f;font-size:16px;font-weight:700;}

@media screen and (max-width:1024px) {
    /*.about_img {height:400px;}
    .about_img h3 {font-size:24px;}
    .about_img h3 strong {font-size:36px;}*/
    .about_con {width:auto;margin:-100px 20px 0 20px;padding:60px;}
    .about_con h3 {font-size:30px;}
    .about_con h4 {font-size:18px;}


    .intro {width:auto;margin:0 40px 40px 40px;}

    .contact ul li {font-size:16px;}

    .map {position:relative;margin:0 0 80px 0;}

    .useinfo {width:auto;margin:0 20px;font-size:13px;}

    .privacy {width:auto;margin:0 20px;font-size:13px;}

    .rule {width:auto;margin:0 20px;font-size:13px;line-height:22px;}
    .rule {}
    .rule h2 {font-size:16px;}
    .rule h3 {font-size:14px;}

    .greeting {width:auto;margin:0 auto 40px auto;padding:0 40px 40px 40px;}
}

@media screen and (max-width:768px) {
    .intro {width:auto;margin:0 20px;font-size:13px;line-height:22px;}
    .intro h3 {margin:0 0 12px 0;font-size:18px;}
    .intro h4 {margin:0 0 8px 0;font-size:16px;}

    .intro ul.history {}
    .intro ul.history li {padding:0;font-size:13px;}
    .intro ul.history li strong {position:relative;font-size:16px;}


    .metal_con {width:auto;margin:0 20px;font-size:13px;line-height:22px;}
    .metal_con h3 {margin:0 0 60px 0;font-size:24px;}
    .metal_con h3 strong {font-size:36px;}
    .metal_con h4 {margin:0 0 18px 0;font-size:18px;}
    .metal_con h5 {margin:0 0 8px 0;font-size:16px;}
    .metal_con h6 {margin:0 0 8px 0;font-size:15px;}


    .greeting p {text-align:center;line-height:24px;}
    .greeting p span {display:inline;}

    .about_con {width:auto;margin:-80px 10px 0 10px;padding:20px;font-size:13px;}
    .about_con h3 {font-size:24px;}
    .about_con h4 {font-size:16px;}
    .about_con span {display:inline;}


    .contact {padding:0 20px;}
    .contact h3 {font-size:14px;}
    .contact p {font-size:14px;}
    .contact ul {margin:0 0 60px 0;}
    .contact ul li {float:none;width:100%;margin:0 0 24px 0;font-size:13px;}
    .contact ul li strong {font-size:14px;}
    .contact ul li strong i {font-size:16px;}


    .contact_traffic {margin:0 auto 40px auto;padding:0 20px;}
    .contact_traffic ul li {min-height:100px;padding:0 0 24px 0px;font-size:13px;line-height:24px;}
    .contact_traffic ul li:last-child {padding:0}
    .contact_traffic ul li strong {display:block;position:relative;left:0px;top:0;width:60px;height:60px;margin:0 0 20px 0;padding:12px 0 0 0;font-size:13px;}
    .contact_traffic ul li strong i {font-size:24px;}
    .contact_traffic ul li span {display:block;width:50px;font-size:11px;text-align:center;}


    .map {position:relative;margin:0 0 60px 0;}

    .useinfo {width:auto;margin:0 10px;font-size:13px;}
    .useinfo h2 {font-size:16px;}
    .useinfo h3 {font-size:14px;}


    .privacy {margin:0 10px;font-size:13px;}
    .privacy h3 {margin:0 0 24px 0;font-size:18px;}
    .privacy strong {font-size:14px}

    .rule {width:auto;margin:0 10px;}


    .greeting {padding:0 20px 40px 20px;}


    .greeting .box {float:none;}
    .greeting .box_img {width:100%;margin:0 0 20px;}
    .greeting .box_con {width:100%;}
    .greeting .box img {width:100%;max-width:300px;height:auto;margin:0 auto 20px auto;}
    .greeting .box .sign {font-size:14px;}
    .greeting .box .sign strong {font-size:16px;}
    .greeting .box h3 {margin:0 0 12px 0;padding:0 0 0 10px;font-size:18px;}
    .greeting .box h3 .bullet {width:3px;height:3px;top:12px;}

    .greeting .box ul.history li {padding:0;font-size:13px;}
    .greeting .box ul.history li strong {position:relative;font-size:16px;}

    .greeting .box ul.history2 li {padding:0;font-size:13px;}
    .greeting .box ul.history2 li strong {position:relative;font-size:16px;}

    #ctt {
        padding:0;
        border-left:0px;
        border-right:0px;
        border-top: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
    }

}