@charset "UTF-8";

/* 한신정보기술 김지경 - 2021.11.05*/
/* body {height:977px;background:url(../images/intro_back.png) no-repeat 50% 50%;background-size:cover;color:#fff;font-weight:600;font-family:'Gmarket', 'Malgun Gothic','맑은 고딕',Dotum,'돋움',Helvetica,AppleSDGothicNeo,sans-serif;} */
body {height:977px;background-color: #cedfed;background-size:cover;color: #203358;font-weight:600;font-family:'Gmarket', 'Malgun Gothic','맑은 고딕',Dotum,'돋움',Helvetica,AppleSDGothicNeo,sans-serif;}


.accessibility {position:relative;overflow:hidden;z-index:3000;width:100%;}
.accessibility a{display:block;overflow:hidden;z-index:3000;height:1px;width:1px;margin:0 -1px -1px 0;font-size:0;line-height:0;text-align:center;}
.accessibility a:focus, #accessibility a:hover, #accessibility a:active {width:auto;height:30px;margin:0;padding:8px 0;background:#20262c;font-size:14px;font-weight:700;line-height:1;color:#fff;}

.wrap{width:1312px;margin: 0 auto;}

.visual .header{margin-top:85px;margin-bottom:30px;}

.visual .logo{font-size:0;line-height:0;}
.visual .logo a{display:block;width:190px;height:47px;font-size:0;line-height:0;background:url(../images/logo.png) no-repeat;}

.visual .intro_con{position:relative;}

.visual .title{text-align:center;}
.visual .title span{font-size:40px;line-height:50px;letter-spacing:0em;word-break:keep-all;/* text-shadow: 3px 4px 27px rgba(0, 0, 0, 0.75); */}
.visual .title .thin{font-weight:400;}


.btn_box{position:relative;top:-50px;}

.btn_group{position:relative;padding:74px;font-size:0;line-height:0;border:1px solid #fff;border-radius:10px;border-top:0;/* background:linear-gradient(to top, rgba(0, 0, 0, 0.6), transparent); */}
.btn_group:before{display:block;position:absolute;top:0;left: -1px;width:340px;height: 100px;border-radius: 10px 0 0 0;border-top: 1px solid #fff;}
.btn_group:after{display:block;position:absolute;top:0;right: -1px;width:340px;height: 100px;border-radius: 0 10px 0 0;border-top: 1px solid #fff;}

.btn_group .btn_wrap{display:inline-block;width: calc((100% - 40px) / 3);margin-right:20px;vertical-align:top;}
.btn_group .btn_wrap:nth-child(3n){margin-right:0;}
.btn_group .btn_wrap:nth-child(n + 4){margin-top:20px;}

.btn_group .btn_wrap a.btn_item{display:table;position:relative;width:82%;height:131px;padding:10px 30px 10px 40px;border-radius:10px;background-color:#fff;font-size:22px;line-height:30px;color:#fff;letter-spacing: -0.1em;font-family:'CoreDream', 'Malgun Gothic','맑은 고딕',Dotum,'돋움',Helvetica,AppleSDGothicNeo,sans-serif;text-decoration:none;overflow:hidden;text-align: center;}
.btn_group .btn_wrap a.btn_item .btn_title{display:table-cell;vertical-align:middle;}
.btn_group .btn_wrap a.btn_item .btn_title em{display:block;font-size:18px;font-weight:400;}

.btn_group .btn_wrap a.btn_item.white .btn_title{color:#025fa4;}
.btn_group .btn_wrap a.btn_item.white .btn_title em{display:block;color:#444;}

.btn_group .btn_wrap a.btn_item.icon .btn_title{/* padding-left:60px; */font-size:20px;line-height:26px;}
.btn_group .btn_wrap a.btn_item.icon .btn_title em{font-size:16px;}

.btn_group .btn_wrap a.btn_item.pink .btn_title{font-size:20px;}
.btn_group .btn_wrap a.btn_item.b_blue .btn_title{padding-left:0;font-size:24px;text-align:center;}
.btn_group .btn_wrap a.btn_item.orange .btn_title{font-size:24px;}

.btn_group .btn_wrap a.btn_item.b_blue .btn_title.text_left{text-align:left;}

/* 버튼 무늬 */

.btn_group .btn_wrap a.btn_item.type1:before{display:block;position:absolute;bottom:0;right:0;width:94px;height:71px;/* background:url(../images/btn_img4.png) no-repeat; */}
.btn_group .btn_wrap a.btn_item.type1.white:before{background:url(../images/btn_img1.png) no-repeat;}
.btn_group .btn_wrap a.btn_item.type2:before{display:block;position:absolute;top:0;left:0;width:100%;height:100%;background:url(../images/btn_img2.png) no-repeat;}
.btn_group .btn_wrap a.btn_item.type3:before{display:block;position:absolute;top:0;left:0;width:100%;height:100%;background:url(../images/btn_img3.png) 50% 50%;}

/* 버튼 색깔 */

.btn_group .btn_wrap a.btn_item.navy{background-color:#203358;}
.btn_group .btn_wrap a.btn_item.blue{background-color:#025fa4;}
.btn_group .btn_wrap a.btn_item.green{background-color:#01979a;}
.btn_group .btn_wrap a.btn_item.pink{background-color:#f23f69;}
.btn_group .btn_wrap a.btn_item.b_blue{background-color:#1d87d5;}
.btn_group .btn_wrap a.btn_item.purple{background-color:#5d55bf;}
.btn_group .btn_wrap a.btn_item.orange{padding:10px 15px 10px 40px;background-color:#f36f21;}

/* 버튼 아이콘 */

.btn_group .btn_wrap a.btn_item.i2 .btn_title span{position:relative;padding-right:30px;padding-top:7px;}
.btn_group .btn_wrap a.btn_item.i2 .btn_title span:before{display:block;position:absolute;right:0;width:26px;height:26px;background:url(../images/icon_img2.png) no-repeat;}

.btn_group .btn_wrap a.btn_item.icon .btn_title{position:relative;}
.btn_group .btn_wrap a.btn_item.icon .btn_title:before{display:block;position:absolute;top:26px;left:0;width:70px;height:60px;background:url(../images/icon_img.png) no-repeat 0 0;}

.btn_group .btn_wrap a.btn_item.i3 .btn_title{padding-left:70px;}
.btn_group .btn_wrap a.btn_item.i4 .btn_title{/* padding-left:75px; */padding-left:0;}
.btn_group .btn_wrap a.btn_item.i6 .btn_title{padding-left:80px;}
.btn_group .btn_wrap a.btn_item.i7 .btn_title{/* padding-left:50px; */}

.btn_group .btn_wrap a.btn_item.i2 .btn_title:before{display:none;}

.btn_group .btn_wrap a.btn_item.i3 .btn_title:before{left:-8px;background-position:-160px 0;}
.btn_group .btn_wrap a.btn_item.i4 .btn_title:before{display:none; left:-5px;background-position:-240px 0;}
.btn_group .btn_wrap a.btn_item.i5 .btn_title:before{background-position:-320px 0;}
.btn_group .btn_wrap a.btn_item.i6 .btn_title:before{background-position:-400px 0;}
.btn_group .btn_wrap a.btn_item.i7 .btn_title:before{left:-7px;background-position:-480px 0;}
.btn_group .btn_wrap a.btn_item.type2.pink .btn_title:before {left: -11px;background-position: -240px 0;}



/* 바로가기 버튼 */

.go_wrap{width:100%;margin:40px 0 0;}
.go_wrap a.go_btn{display:inline-table;width:400px;height:70px;margin:0 15px 0 0;border:2px solid #fff;border-radius:10px;background-color:rgba(0, 0, 0, 0.5);text-align:center;font-size:24px;line-height:30px;letter-spacing:-0.05em;color:#fff;text-decoration:none;font-family:'CoreDream', 'Malgun Gothic','맑은 고딕',Dotum,'돋움',Helvetica,AppleSDGothicNeo,sans-serif;}
.go_wrap a.go_btn:nth-child(2){margin:0;}
.go_wrap a.go_btn span{display:table-cell;position:relative;padding-left:44px;vertical-align:middle;}
.go_wrap a.go_btn span:before{display:block;position:absolute;top:22px;width:22px;height:22px;background:url(../images/go_btn_icon.png) no-repeat;}



/* sns 아이콘 */

.visual .sns_icon{position:absolute;bottom:17px;right:10px;font-size:0;line-height:0;}
.visual .sns_icon a{width:36px;height:36px;margin-right:10px;border-radius:10px;background:url(../images/sns_icon.png) no-repeat;background-color:#fff;}
.visual .sns_icon a.type2{background-position: -46px 0;}
.visual .sns_icon a.type3{background-position: -92px 0;}
.visual .sns_icon a.type4{background-position: -138px 0;}
.visual .sns_icon a.type5{background-position: -184px 0;}
.visual .sns_icon a:last-child{margin-right:0;}

.visual .sns_icon a:hover{transition: all 0.3s ease-in-out;box-shadow: 0 0 10px 0 rgba(0, 0, 0, 1);}


@media all and (max-width:1400px){
    body{background-size:cover;height:100%;}

    .wrap{width:1000px;}

    .btn_group:before{width:200px;}
    .btn_group:after{width:200px;}

    .btn_group .btn_wrap{width:calc((100% - 40px) / 3);}
    .btn_group .btn_wrap:nth-child(4n){margin-right:20px;margin-top:20px;}
    .btn_group .btn_wrap:nth-child(3n){margin-right:0;}
}

@media all and (max-width:1000px){
    .wrap{width:760px;}

    .btn_box{top:-20px;}

    .btn_group{padding:60px 95px;}
    .btn_group:before{width:80px;}
    .btn_group:after{width:80px;}
    .btn_group .btn_wrap{width:calc((100% - 20px) / 2);}
    .btn_group .btn_wrap:nth-child(3n){margin-right:20px;margin-top:20px;}
    .btn_group .btn_wrap:nth-child(2n){margin-right:0;}

    .go_wrap{margin:30px 0 50px;}
    .go_wrap a.go_btn{margin:0 0;}
    .visual .sns_icon{right:0;}
}

@media all and (max-width:800px){
    .wrap{width:calc(100% - 40px);}

    .btn_box{top:0;}

    .btn_group{padding:20px;border:none;background:transparent;}
    .btn_group:before{display:none;}
    .btn_group:after{display:none;}

    .visual .sns_icon{position:relative;bottom:auto;margin-top:40px;text-align:center;}

    .go_wrap a.go_btn{margin:0 auto;}
}

@media all and (max-width:640px){
    .visual .header{margin-top:30px;margin-bottom:25px;}
    .visual .logo a{width:152px;height:39px;margin:0 auto;background-size:contain;}

    .visual .title span{font-size:22px;line-height:30px;}

    .btn_box{margin-top:27px;}

    .btn_group .btn_wrap{width:100%;margin-right:0;}
    .btn_group .btn_wrap:nth-child(2n){margin-top:10px;}
    .btn_group .btn_wrap:nth-child(3n){margin-right:0;margin-top:10px;}
    .btn_group .btn_wrap:nth-child(n + 5){margin-top:10px;}

    .visual .sns_icon{margin-top:10px;}

    .go_wrap{margin:30px 0 50px 0;}
    .go_wrap a.go_btn{width:100%;padding:0 40px;font-size:15px; margin-bottom:7px;}
    .go_wrap a.go_btn:last-child{margin-bottom:0px;}
    .go_wrap a.go_btn span{padding-left:25px;}
    .go_wrap a.go_btn span:before{left:0;top:25px;width:17px;height:17px;background-size:contain;}
}
.text_center{text_align:center;}