@charset "utf-8";
/* (주)한신정보기술 김의향 - 2019.10 */

body{position:relative;font-size:15px;line-height:24px;color:#515151; font-family:'NotoKr','Malgun Gothic','맑은 고딕',Dotum,'돋움',Helvetica,AppleSDGothicNeo,sans-serif; font-weight:400;}

body{background-color:#f8f4f0; background-repeat:no-repeat; background-position:center top; background-image:url(/site/landing/images/contents/landing_body_bg2.jpg);}
#wrapper{position:relative; min-width:1200px; overflow:hidden;}
.wrap{position:relative;width:1200px;margin:0 auto;}
.skip{overflow:hidden;}

#header{margin-bottom:130px;}
#header:before{display:none;}
#header .wrap{padding-top:34px;}
#header .logo h1{margin-left:48px; text-align:left;}
#header .logo h1 a{display:inline-block; line-height:0; text-align:center;}

#container .wrap{position:relative;}
#container .wrap:before{position:absolute; bottom:110px; right:0; display:block; width:610px; height:591px; background-repeat:no-repeat; background-position:right bottom; background-image:url(/site/landing/images/contents/container_icon2.png); content:''; z-index:1;}
.contentbox{position:relative; max-width:716px; z-index:5;}

.contentbox .titlebox{max-width:410px; border-color:rgba(255,255,255,0.5); border-style:solid; border-width:1px 0; margin-bottom:51px; padding:12px 25px;}
.contentbox .titlebox p{line-height:23px; text-align:center; color:#fff; font-size:18px; letter-spacing:0.3em;}
.contentbox .titlebox p em{color:#fff; font-weight:600;}
.contentbox h2{margin-bottom:44px; line-height:68px; color:#fff; font-family:'Malgun Gothic','맑은 고딕',Dotum,'돋움',Helvetica,AppleSDGothicNeo,sans-serif; font-size:50px; font-weight:100; letter-spacing:-0.13em; text-shadow:3px 3px 4px rgba(0,0,0,0.2);}
.contentbox h2 em{color:#fff; font-weight:600;}
.contentbox .textbox{margin-bottom:57px;}
.contentbox .textbox p{line-height:26px; color:#fff; font-size:20px; letter-spacing:-0.03em;font-weight:300; text-shadow:3px 3px 5px rgba(0,0,0,0.17);}
.contentbox .textbox p em{color:#fff;}
.contentbox .linkbox a{display:inline-block; padding:13px 45px; border-radius:25px; background:linear-gradient(to right,  rgba(173,0,189,1) 0%,rgba(219,95,161,1) 49%,rgba(255,169,140,1) 100%); font-size:16px; line-height:26px; color:#fff; text-decoration:none;}
.contentbox .linkbox a:hover{text-decoration:underline;}
.contentbox .textbox p span {display:inline-block; }
.contentbox .textbox p span:first-child {display:inline-block; font-size:18px; line-height:26px; font-weight:600;}
.contentbox .textbox p span:last-child {display:inline-block; font-size:20px; line-height:26px;}


#footer .h_logo{position:absolute; bottom:41px; left:calc(50% + 99px);}

/* web */
@media screen and (max-width:1200px){
    #container .wrap:before{right:0;}
    #footer .h_logo{ bottom:10px; left:calc(50% - 68px);}
}

/* tablet */
@media screen and (max-width:1000px){
    #wrapper{overflow-x:hidden; min-width:0;}
    .wrap{max-width:none; width:94%;}
    #header{margin-bottom:68px;}
    #container{position:relative;}
    #container .wrap{position:static; padding-bottom:40%;}
    #container .wrap:before{bottom:70px; height:0; padding:20% 0; background-size:contain;}

    .contentbox .titlebox{margin-bottom:30px;}
    .contentbox h2{margin-bottom:28px; line-height:48px; font-size:42px;}
    .contentbox .textbox{margin-bottom:25px;}
    .contentbox .datebox p{font-size:18px;}
    .contentbox .datebox p em{font-size:23px;}
}

/* mobile */
@media screen and (max-width:640px){
    body:before{bottom:45px;}
    #header{margin-bottom:30px;}
    #header .wrap{padding-top:40px;}
    .contentbox .titlebox{padding:12px 4%;}
    .contentbox .titlebox p{letter-spacing:0.2em;}
    .contentbox h2{line-height:36px; font-size:32px;}
    .contentbox .textbox p{line-height:22px; font-size:15px;}
    .contentbox .datebox p{line-height:24px; font-size:16px;}
    .contentbox .datebox p em{font-size:18px;}
    .contentbox .datebox p strong{margin-left:0; font-size:18px;}
}
