@charset "utf-8";

/*수정*/
.wrap_goto{display:flex;flex-wrap:wrap;background:#FFF;border:1px solid #EEE;}
.wrap_goto a{display:block;padding:0 25px;margin:25px 0;width:25%;border-right:1px solid #EEE;position:relative;}
.wrap_goto a:last-child{border:0;}
.wrap_goto a i{font-family:'Dream Medium';font-size:22px;color:#222;display:block;line-height:1.2;}
.wrap_goto a span{font-family:'Play Bold';font-size:18px;color:#888;display:block;line-height:1;padding-top:5px;}
.wrap_goto a::before{content:"";opacity:0;transition:0.5s;display:block;width:30px;height:30px;background:url(/sites//templet_guide/images/common/icon_share_b_2.png) no-repeat center;position:absolute;right:20px;top:calc(50% - 15px);}
@media all and (min-width:1281px){
  .wrap_goto a:hover::before{opacity:1;}
}
@media all and (max-width:768px){
  .wrap_goto{padding:15px 0;}
  .wrap_goto a{width:50%;border-right:0;margin:0;padding:15px;}
  .wrap_goto a i{font-size:18px;}
  .wrap_goto a span{font-size:15px;} 
}


/*BG*/
#multipleDiv_templet_graduated_A_11{background:#f9f9f9 url(../../images/bg_1.jpg) no-repeat center;}
#multipleDiv_templet_graduated_A_14{background:#f9f9f9 url(../../images/bg_2.jpg) no-repeat center;}
@media all and (max-width:1700px){
}


/*COMMON*/
#multipleContentsDiv_templet_graduated_A_11,
#multipleContentsDiv_templet_graduated_A_12,
#multipleContentsDiv_templet_graduated_A_14{max-width:1700px;margin:0 auto;}
#multipleContentsDiv_templet_graduated_A_11,
#multipleContentsDiv_templet_graduated_A_12,
#multipleContentsDiv_templet_graduated_A_14{padding:100px 0;}
@media all and (max-width:1700px){
  #multipleContentsDiv_templet_graduated_A_11,
  #multipleContentsDiv_templet_graduated_A_12,
  #multipleContentsDiv_templet_graduated_A_14{max-width:96%;}
}
@media all and (max-width:1280px){
  #multipleContentsDiv_templet_graduated_A_11,
  #multipleContentsDiv_templet_graduated_A_12,
  #multipleContentsDiv_templet_graduated_A_14{padding:60px 0;}
}
@media all and (max-width:768px){
  #multipleContentsDiv_templet_graduated_A_11,
  #multipleContentsDiv_templet_graduated_A_12,
  #multipleContentsDiv_templet_graduated_A_14{padding:40px 0;}
}


/*슬로건*/
#menu6036_obj22{position:absolute;top:0;left:0;width:100% !important;}
.slogan{max-width:1700px;margin: 0 auto;color:#FFF;line-height:1.3;padding-top:350px;}
.slogan .item_1{font-family:'Dream Regular';font-size:15px;}
.slogan .item_2{font-family:'Dream Medium';font-size:42px;text-shadow:1px 1px 1px #000;padding-top:15px;}
.slogan .item_3{font-family:'Dream Medium';font-size:42px;text-shadow:1px 1px 1px #000;letter-spacing:-2px;padding-top:5px;}
.slogan .item_3 span{display:block;}
@media all and (max-width:1700px){
  .slogan{max-width:96%;}
}
@media all and (max-width:1280px){
  .slogan{padding-top:150px;}
  .slogan .item_2,
  .slogan .item_3{font-size:35px;}
}
@media all and (max-width:768px){
  .slogan .item_1{font-size:14px;}
  .slogan .item_2,
  .slogan .item_3{font-size:22px;}
}


/*타이틀*/
.mainTitle{text-align:center;}
.mainTitle::after{content:"";display:block;width:100px;height:2px;background:#222;margin:30px auto 50px auto;}
.mainTitle strong{font-family:'Play Bold';font-size:50px;letter-spacing:-2px;line-height:1;}
@media all and (max-width:1280px){
  .mainTitle strong{font-size:40px;}
  .mainTitle::after{width:80px;margin:20px auto 30px auto;}
}
@media all and (max-width:768px){
  .mainTitle strong{font-size:30px;}
  .mainTitle::after{width:60px;}
}


.wrap_banner{display:flex;flex-wrap:wrap;}
.wrap_banner a{width:24%;margin:0.5%;display:flex;align-items:flex-start;padding:30px;border:1px solid #EEE;border-top:3px solid #222;background:#f9f9f9;transition:0.5s;}
.wrap_banner a img{max-width:35px;}
.wrap_banner a span{padding-left:15px;max-width:calc(100% - 30px);line-height:1.3;color:#222;}
.wrap_banner a strong{font-family:'Dream Bold';font-size:20px;display:block;padding-bottom:10px;}
.wrap_banner a i{font-family:'Dream Regular';font-size:16px;}
/*HOVER*/
@media only screen and (min-width:1281px){
  .wrap_banner a:hover{box-shadow:0 0 10px rgba(0,0,0,0.1);border-color:#03499a;}
  .wrap_banner a:hover span{color:#03499a;}
}
@media all and (max-width:1280px){
  .wrap_banner a{width:32.3%;padding:20px;}
}
@media all and (max-width:768px){
  .wrap_banner a{width:49%;}
}
@media all and (max-width:520px){
  .wrap_banner a{width:100%;margin:0 0 20px 0;padding:15px;}
  .wrap_banner a strong{font-size:18px;}
  .wrap_banner a span{font-size:14px;}
}


/*비디오*/
.wrap_video{height:100%;}
.wrap_video a{display:flex;align-items:center;justify-content:center;width:100%;height:100%;position:relative;}
.wrap_video a .item_1{position:absolute;left:0;top:0;height:100%;width:100%;}
.wrap_video a .item_1 img{height:100%;width:100%;}
.wrap_video a .item_2{position:relative;display:flex;flex-direction:column;font-family:'Dream Medium';line-height:1.3;text-align:center;}
.wrap_video a .item_2 i{font-size:16px;color:#FFF;}
.wrap_video a .item_2 strong{font-size:24px;color:#FFF;}
.wrap_video a .item_2::after{content:"";display:block;width:50px;height:50px;margin:15px auto 0 auto;background:url(../../images/icon_play.png) no-repeat center;}
/*HOVER*/
@media only screen and (min-width:1281px){
	.wrap_video a:hover{text-shadow:0 0 10px #000;transition:0.5s;}
	.wrap_video a:hover .item_2::after{transform: rotatey(360deg);transition: all 0.7s cubic-bezier(0.2, 0, 0.3, 1);}
}
@media all and (max-width:768px){
	.wrap_video a{align-items:flex-start;justify-content:space-between;flex-direction:row-reverse;}
	.wrap_video a .item_1{width:calc(100% - 200px);position:relative;left:unset;top:unset;height:unset;width:unset;height:unset;}
	.wrap_video a .item_1 img{height:unset;}
	.wrap_video a .item_1::after{content:"";display:block;width:50px;height:50px;position:absolute;left:calc(50% - 25px);top:calc(50% - 25px);background:url(../../images/icon_play.png) no-repeat center;}
	.wrap_video a .item_2{width:200px;text-align:left;padding-bottom:20px;}
	.wrap_video a .item_2 i{font-size:14px;color:#999;}
	.wrap_video a .item_2 strong{color:#333;}
	.wrap_video a .item_2::after{display:none;}
}
@media all and (max-width:420px){
	.wrap_video a{flex-direction:column-reverse;}
	.wrap_video a .item_1,
	.wrap_video a .item_2{width:100%;}
}