@charset "utf-8";

@font-face { font-family: 'DWImpactamin'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@1.0/DWImpactamin.woff') format('woff'); font-weight: normal; font-style: normal; }

*{box-sizing: border-box !important}
.wrap_con {overflow: visible;}

/* 랜딩페이지 */
.landing{padding-top: 14rem; height:100vh;}
.landing #visual{text-align: center;}
.landing #section1{width:100%;position: absolute;left: 0;bottom: 0;}

/*레이어팝업*/
html.layerpop-active { overflow: hidden;}
.layerpop-area { display: none; position: fixed; top: 0; left: 0; width: 100%; background-color: rgba(0,0,0, .7); transition: all 0.3s ease; height: 0; animation-duration: 1s; transition: all .5s ease; visibility: hidden; opacity: 0; z-index: -1; }
html.layerpop-active .layerpop-area {display: block; height: 100%; visibility: inherit; overflow: auto; opacity: 1; z-index: 100; }
.layerpop-area .layerpop_wrap{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); max-width: 600px; max-height: 470px;}
.layerpop-area .layerpop {position:relative; background-color: #fff; overflow: hidden}
.layerpop-area .layerpop a{display: block; width:  100%; height: 100%; }
.layerpop-area .layerpop a img{transition: all 0.3s ease; -webkit-transition: all 0.3s ease; }
.layerpop-area .cont { overflow: hidden; }
.layerpop-area .cont img { max-width: 100%; }	
.layerpop img {max-width: 100%;}	
.layerpop_wrap .controls{ overflow: hidden; padding:20px 0; font-size: 1.6rem; color:#fff;}
.layerpop_wrap .controls .play{display: none;}
.layerpop_wrap .controls a{color: #fff;}
.layerpop_wrap .controls i{font-size: 1.6rem; margin: 0 3px;}
.layerpop_wrap .controls .arrows{ float: left;}
.layerpop_wrap .controls .close { float: right;}
.layerpop_wrap .controls .close span + span{margin-left: 1rem}
.layerpop_wrap .controls .close::after {content:''; display:block; clear:both;}
.layerpop_wrap .controls .slick-counter{font-size:1.6rem; color:#000; text-align:center; font-weight:700; color:#fff; display: inline-block; font-family: 'Montserrat'}
.layerpop_wrap .controls .slick-counter span{font-size: 1.6rem; padding: 0 7.5px; position: relative;}
.layerpop_wrap .controls .slick-counter span + span{margin-left: 5px;}
.layerpop_wrap .controls .slick-counter span + span:before{content: ''; position: absolute; left: -7px; top:50%; transform: translateY(-50%) rotate(-55deg); width:  11px; height: 1px; background: #fff; display: block; }
.layerpop_wrap .controls .stop{font-size: 1.1rem;}

#body{margin-bottom: 0;}
#body::before{display: none;}

/* 비주얼 존 */

.row:after{content: ''; clear: both; display: block}

@keyframes rotate {
	50% {transform:rotate(180deg);}	
	100% {transform:rotate(360deg);}	
}
#visual::before,
#visual::after{content: '';display: block;width: 29.3rem;height: 29.3rem;background: url(../img/main/rotate_obj.png) 0 0/contain no-repeat; animation:rotate 12s linear infinite;position: absolute;z-index: -1;}
#visual::before{top: 17rem;left:-15.65rem;}
#visual::after{right:-15.65rem; top:45rem;}


#visual .slogan{display: flex;align-items:center;margin-bottom: 3.7rem;}
#visual .slogan .txt1{margin-right: 50px;}
#visual .visual_wrap{position: relative; max-width:1400px;margin:0 auto;padding-top: 3.7rem;}
#visual .visual_slide{position: relative;margin-right: -4rem;}
#visual .visual_slide .slick-track,
#visual .visual_slide .slick-list{ height: 100%; }
#visual .visual_slide .slick-list .item{position: relative;}
#visual .visual_slide .slick-list .item:focus{outline: none;}
#visual .visual_slide .slick-list .item:before{content: ""; display: block; position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; background-color:transparent; border: 2px solid transparent; border-radius:5px;}
#visual .visual_slide .slick-list .item:focus:before{border-color: black;}
#visual .visual_slide .item ~ .item{margin-left: 4rem;}
#visual .visual_slide .item > .img{display: block; height: 100%; overflow: hidden;  position: relative;border-radius: 4.2rem; }
#visual .visual_slide .item img{margin:0 auto; transform: scale(1); transition: .3s}

#visual .visual_slide .item > .img img{width: auto;}
#visual .visual_slide .item:hover img{transform:scale(1.05);}


#visual .visual_slide .refer{ position: absolute; left: 50%; top: 15%; width: calc(100% - 4rem); max-width: 1400px; transform: translateX(-50%); z-index: 10}
#visual .visual_slide .refer .box{width: 100%; max-width: 550px;}
#visual .visual_slide .refer .title{font-size: 6rem; font-weight: 700; color:#fff; text-shadow: 0px 1px 1px rgba(0,0,0,0.29); font-family: "montserrat"; margin-bottom: 3rem;  position: relative; z-index: 10}
#visual .visual_slide .refer .sub_tit{font-size: 3.2rem; font-weight: 700; color: #fff; margin-bottom: 2rem;display: block;  position: relative; z-index: 10}
#visual .visual_slide .refer .sub_tit2{font-size: 2.4rem; font-weight: 700; color: #fff; margin-bottom: 3rem;display: block; line-height: 3.4rem; }
#visual .visual_slide .refer .txt{font-size: 2rem; font-weight: 400; color:#fff; line-height: 3rem; margin-bottom: 3rem}
#visual .visual_slide .refer a{display: inline-block; overflow: hidden; padding:.75rem 2rem; border-radius: 25px; color:#fff; border:1px solid #fff; position: relative; transition: .1s; transition-delay: .3s; position: relative}
#visual .visual_slide .refer a i{position: absolute; right: 2rem; top: 50%; transform: translateY(-50%); transition: .3s;}

#visual .visual_slide .refer a { overflow: hidden; padding: 0; -webkit-transition: border-color 0.5s, background-color 0.5s; transition: border-color 0.5s, background-color 0.5s; -webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1); color:#fff}
#visual .visual_slide .refer a:after { content: '자세히보기'; position: absolute; width: 100%; height: 100%; top: 0; left: 0; opacity: 0; color: #151515; -webkit-transform: translate3d(0, 25%, 0); transform: translate3d(0, 25%, 0);}
#visual .visual_slide .refer a:after,
#visual .visual_slide .refer a  > span {display: block; padding: .75rem 5rem .75rem 2rem; -webkit-transition: -webkit-transform 0.5s, opacity 0.5s; transition: transform 0.5s, opacity 0.5s; -webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1); transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);}
#visual .visual_slide .refer a:hover { border-color: #3f51b5;background-color: rgba(63, 81, 181, 0.1);}
#visual .visual_slide .refer a:hover { border-color: #fff; background-color: #fff; }
#visual .visual_slide .refer a:hover i{color:#151515;  right:1.5rem}
#visual .visual_slide .refer a:hover::after { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); font-weight: 600;}
#visual .visual_slide .refer a:hover > span { opacity: 0; -webkit-transform: translate3d(0, -25%, 0); transform: translate3d(0, -25%, 0); }

#visual .visual_wrap .visual_ele{ position: absolute; right:0; top: 5rem; display: flex; align-items:center;}
#visual .visual_wrap .visual_ele .controls{display: flex;align-items:center;}
#visual .visual_wrap .visual_ele .controls .arrows{display: flex; align-items:center;}
#visual .visual_wrap .visual_ele .controls a{ color:#3E3E3E; width: 3rem; display: inline-block; font-size: 18px;line-height: 1.8; position: relative; text-align:center; }
#visual .visual_wrap .visual_ele .controls .slick-counter{width: 70px; text-align: center; font-family: 'montserrat'; }
#visual .visual_wrap .visual_ele .controls .slick-counter span{width: 30px; display: inline-block;  font-size: 2rem; font-weight: 600; }
#visual .visual_wrap .visual_ele .phause a{font-size: 2.5rem;line-height: 1.3;}
#visual .tab_list{position: absolute; margin-left: 110px; top:13%; color:#3E3E3E; width: 590px;}
#visual .tab_list .cls_tab{display: none}
#visual .tab_list_wrap > .row{margin: 0 0 0 -4rem; position: relative}
#visual .tab_list .item {width: 33.333333333%; height: 215px; float: left; padding: 2rem 0 2rem 4rem; }
#visual .tab_list .item > a{display: block; width: 100%; height: 100%; background:rgba(31, 54, 80, .29); border-radius: 15px; padding: 2.5rem 1rem 1rem; text-align: center; transition: .3s; position: relative; overflow: hidden}
#visual .tab_list .item > a:before{content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width:0;height:0; background: #1F3650; z-index: -1; border-radius: 50%; transition: .5s;opacity: 0;}
#visual .tab_list .item > a:hover, #visual .tab_list .item.active > a{background:transparent; }
#visual .tab_list .item > a:hover:before, #visual .tab_list .item.active > a:before{width: 150%; height: 150%; opacity: 1;}
#visual .tab_list .item > a span{min-height: 73px; display: inline-block;}
#visual .tab_list .item > a span img{vertical-align: middle}
#visual .tab_list .item > a p{color:#fff; font-size: 18px; font-weight: 700; line-height: 2.6rem; margin-top:  .5rem}
#visual .tab_list .item:nth-child(4) > a p{ color: #fff; font-size: 16px; font-weight: 700; margin-top: .5rem; letter-spacing: -0.05rem;}
#visual .tab_list .item .over_box{visibility: hidden; opacity: 0; position: absolute; left: 4rem; width: 100%; z-index: 1; background: #fff; padding:3rem 1.9rem 1rem; box-shadow: 0px 9px 16px rgba(0,0,0,0.3); border-radius: 15px; max-width: 600px; width: auto; top: 50%; min-height: 175px; transition: .3s;}
#visual .tab_list .item.active .over_box{ visibility: visible; opacity: 1}
#visual .tab_list .item .over_box:before{content: ''; width: 0px;height: 0px; border-top: none; border-bottom:10px solid #fff; border-right: 10px solid transparent; border-left: 10px solid  transparent; position: absolute; left:0; top:-10px; }

/*#visual .tab_list .item .scroll_x{width: 550px; overflow-x: auto; border:1px solid red }*/
/* #visual .tab_list .item .row{width: 600px } */
/*#visual .tab_list .item .over_box{overflow-x: auto;}*/
#visual .tab_list .item .item2{float: left; display: block; }
#visual .tab_list .item .item2 a{display: block; padding: 0 2.2rem; text-align: center; border-left: 1px solid #ddd }
#visual .tab_list .item .item2 a span{display: block; min-height: 80px;}
#visual .tab_list .item .item2 a p{font-size: 1.6rem; font-weight: 500; color:#151515}
#visual .tab_list .item .item2:first-of-type a{border: none;}
#visual .tab_list .row{ display: inline-block;}


#visual .class_search{width: calc(140rem - 4rem); padding: 3rem 0; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); }
#visual .class_search:before{content: ''; position: absolute; left: 50%; top:0; transform: translateX(-50%); width: 1600px; height: 100%;  background: #1e3550; z-index: -1}
#visual .class_search .srh_tab{width: 346px; float: left;}
#visual .class_search .srh_tab a{color:#fff; padding: .75rem 3rem; width: 180px;border-radius: 25px; display: inline-block; border: 1px solid #fff; text-align: center; position: relative; transition: .2s;}
#visual .class_search .srh_tab a:hover, #visual .class_search .srh_tab a:focus{background: #fff; color:#1e3550}
#visual .class_search .srh_tab a:nth-of-type(2){margin-left: -20px;}
#visual .class_search .srh_tab a i{position: absolute; right: 3rem; top: 50%; transform: translateY(-50%); display: none;}
#visual .class_search .srh_tab a.active{ text-align: left; border-color: #1F468A; background: #1F468A; z-index: 1; color:#fff}
#visual .class_search .srh_tab a.active i{display: block}
#visual .class_search .srh_tab a.active:hover{color:#fff}
#visual .class_search [class*="area"]{display: none; width: calc(100% - 346px); float: right;}
#visual .class_search [class*="area"] .btnArea{float: right;}
#visual .class_search [class*="area"] .btnArea .btn{ width: 170px; text-align: center; color:#fff; border:1px solid #fff; padding: .75rem 3rem; transition: .3s;}
#visual .class_search [class*="area"] .btnArea .btn:hover{background: #fff; font-weight: 700; color:#1e3550}
#visual .class_search [class*="area"] .slcArea{padding: 0 20px 0 40px; width: calc(100% - 170px); float: left; }
#visual .class_search [class*="area"] select{width: 100%; height: 39px;}
#visual .class_search [class*="area"].active{display: block; }

#visual .selectBox select{appearance: none;}
#visual .selectBox{position: relative;}
#visual .selectBox:before{content: '\e942'; position: absolute; right: 1rem; top: 10px; font-family: 'xeicon'; color:#333}

#visual .class_area .selectBox{width: calc(50% - 10px); float: left; }
#visual .class_area .selectBox:nth-of-type(2){margin-left: 20px;}


#visual .subject_area .selectBox{width: 100%; float: left; }
/*#visual .subject_area .radioBox{width: 20%; float: left; padding: 6px 20px;}*/

#visual .subject_area .radioBox .form_control_ra{float: left; width: 50%; text-align: center}



.form_control_ra{display: block; position: relative; }
.form_control_ra label{position: relative;padding-left: 20px; box-sizing: border-box;cursor: pointer}
.form_control_ra label:before{content: ''; position: absolute; left: 0; top: 6px; width: 14px; height: 14px; border-radius: 50%;  border:1px solid #CFD1D3; background: #fff; box-sizing: border-box}
.form_control_ra label:after{content: ''; position: absolute; left: 0; top:6px; width: 14px; height: 14px; border:4px solid #0AD783; box-sizing: border-box; border-radius: 50%; display: none}
.form_control_ra input[type="radio"]:checked ~ label:after{display: block;}
.form_control_ra input{cursor:pointer; overflow: hidden; position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0 none; clip: rect(0, 0, 0, 0); }
.form_control_ck input{cursor:pointer; overflow: hidden; position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0 none; clip: rect(0, 0, 0, 0);  }
.form_control_ck{display: inline-block; margin-right: 20px; position: relative}
.form_control_ck label{position: relative; padding-left: 20px; cursor: pointer}
.form_control_ck label:before{content: ''; position: absolute; left: 0; top: 4px; width: 14px; height: 14px;  border:1px solid #CFD1D3; background: #fff; box-sizing: border-box}
.form_control_ck label:after{content: '\e929'; position: absolute; left: -1px; top: 4px; width: 15px; height: 14px; box-sizing: border-box; color:#fff; display: none; font-family: 'xeicon'; line-height: 14px;}
.form_control_ck input[type="checkbox"]:checked ~ label:before{background: #0AD783; border-color:#0AD783}
.form_control_ck input[type="checkbox"]:checked ~ label:after{display: block;}







.cont{width: calc(100% - 4rem) ; max-width: 1400px; padding:6rem 0;margin:0 auto; position: relative; }
.cont:after{content: ''; clear: both; display: block;}

.bul li{padding-left: 1rem; position: relative}
.bul li + li{margin-top: 1rem; }
.bul.square li:before{content: ''; position: absolute; left: 0 ;top: 10px; width: 3px; height: 3px; background: #333}







/* section1 */
#section1{position: relative;}
#section1 .cont{display: flex;}
#section1 .cont > div{flex:0 0 49%;max-width: 49%;}
#section1 .cont > div~div{margin-left: 3rem;}

#section1 .cont > div:nth-of-type(2){display: flex; }
#section1 .notice_wrap{position: relative;}
#section1 .notice_wrap #tab2{display: none;}
#section1 .notice_wrap .tabs{display: flex;border-bottom: 4px solid #151515;margin-bottom: 1.5rem;}
#section1 .notice_wrap .tabs li{position: relative;}
#section1 .notice_wrap .tabs li ~ li{margin-left: 2.5rem;}
#section1 .notice_wrap .tabs .title{display: block;}
#section1 .notice_wrap .tabs .active::after{content: ''; display: block; width: 100%; height: 7px;background: var(--color1); position: absolute;left: 0;bottom: -4px;z-index: 1;}
#section1 .notice_wrap .title{padding-bottom: 2rem; }
#section1 .notice_wrap .title h3{display: inline-block; font-size: 2.4rem; font-weight: 700; color: #151515}
#section1 .notice_wrap .more{ position: absolute; right: 0; top: 0; font-size: 3rem; }
#section1 .notice_wrap .more i{transition: .3s}
#section1 .notice_wrap .more i:hover{transform: rotate(180deg)}
#section1 .notice_wrap .list{margin-bottom: 0;min-height:16rem;}
#section1 .notice_wrap .list li{padding-left: 2rem;}
#section1 .notice_wrap .list li:before{left: 0;width: 4px;height: 4px;}
#section1 .notice_wrap .list li .tit{width: calc(100% - 100px); display: block; text-overflow: ellipsis; word-break: break-all; overflow: hidden; white-space: nowrap}
#section1 .notice_wrap .list li .date{position: absolute; right:0; top:4px; }
#section1 .notice_wrap .list li + li{margin-top: .6rem}
#section1 .notice_wrap .announce .list li:first-of-type{padding: 0 0 1.5rem 8rem; }
#section1 .notice_wrap .announce .list li:first-of-type:before{display: none}
#section1 .notice_wrap .announce .list li:first-of-type .tit{width: 100%; font-size: 17px; font-weight: 700; color:#151515; white-space: normal; display: -webkit-box; -webkit-line-clamp:1; line-height: 2.2rem; margin-bottom: 10px;}     
#section1 .notice_wrap .announce .list li:first-of-type .desc{display: block;
    font-size: 16px;
    color: #555;
    display: block;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    height: 50px;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    word-wrap: break-word;
    word-break: keep-all;
    line-height: 1.5;}  
#section1 .notice_wrap .announce .list li:first-of-type .date{background: #133460;color: #fff;right: inherit; left: 0; top:50%;	transform:translateY(-50%); width: 6rem; height: 6rem; text-align: center; border-radius: 20px; transition: .3s; padding-top: .7rem; font-family: 'montserrat';}
#section1 .notice_wrap .announce .list li:first-of-type .date strong{display: block; font-size: 2.4rem; font-weight: 600; line-height: 2.4rem; }
#section1 .notice_wrap .announce .list li:first-of-type .date span{font-size: 1.2rem;letter-spacing:-.5px;}
#section1 .notice_wrap .list li a:hover .tit , #section1 .notice_wrap .list li a:focus .tit{text-decoration: underline}
#section1 .notice_wrap .list .desc{display: none;}
#section1 .notice_wrap .list li .date{font-size: 14px; font-family: 'Roboto'; color:#777777; }
#section1 .notice_wrap .list li .date strong{font-weight: normal;}

/*
#section1 .notice_wrap .list li .date.first{font-size: 12px;  font-family: 'Montserrat'; color:#151515; text-align: center; font-weight: 700; padding-top: .5rem}
#section1 .notice_wrap .list li .date.first strong{display: block; font-size: 2.4rem; font-weight: 700; line-height: 2.4rem}
#section1 .notice_wrap .list li:first-of-type .desc{color: #555; font-size: 1.6rem;}
*/
#section1 .ban_wrap .banBox{position: relative;flex:1 1 50%;max-width:50%;}
#section1 .ban_wrap .banBox:nth-of-type(2){margin-left: 2rem;}
#section1 .ban_wrap .banBox a{display: block; width: 100%; height: 100%; border: 2px solid #EEEEEE; border-radius: 4rem;padding: 4rem 10rem 4rem 4rem; position: relative; transition: .3s; overflow: hidden;background: #fff;}
#section1 .ban_wrap .banBox a:before{content: ''; position: absolute; right: 30px; bottom: 30px; background: url(../img/main/ban_icon1.png) no-repeat; width: 73px; height: 71px}

#section1 .ban_wrap .banBox:nth-of-type(1) a:before{ background: url(../img/main/ban_icon1.png) no-repeat; }
#section1 .ban_wrap .banBox:nth-of-type(2) a:before{ background: url(../img/main/ban_icon2.png) no-repeat; }
#section1 .ban_wrap .banBox h3{ font-size: 2.2rem; font-weight: 700; line-height: 2.8rem; color: #151515; margin-bottom: 2rem; position: relative; display: inline-block}
#section1 .ban_wrap .banBox h3 p{font-size: 1.6rem}
#section1 .ban_wrap .banBox span{display: block; font-size: 1.4rem;color: #777777;font-family: 'Roboto'; margin-top: 2rem; }
#section1 .ban_wrap .banBox .more {transition:.2s;
    position: absolute;
    right: 3rem;
    top: 3rem;
    font-size: 3rem;
}
#section1 .ban_wrap .banBox a:hover .more{transform: rotate(180deg);}
#section1 .ocean { height: 256px; width:400%;position:absolute;bottom:0;left:0; z-index: -2; }
#section1 .ocean  .wave {background: url(../img/main/wave.svg) repeat-x; position: absolute; bottom:0;  width: 100%; height: 256px; opacity: .5; animation: move-forever 20s linear infinite; /* animation: wave 7s cubic-bezier( 0.36, 0.45, 0.63, 0.53) infinite; transform: translate3d(0, 0, 0); */
}
/*
#section1 .ocean  .wave:nth-child(1) {
animation-delay: -2s;
animation-duration: 7s;
}
 #section1 .ocean  .wave:nth-child(2) {
animation-delay: -3s;
animation-duration: 10s;
}

#section1 .ocean  .wave:nth-child(3) {
animation-delay: -4s;
animation-duration: 13s;
}
#section1 .ocean  .wave:nth-child(4) {
animation-delay: -5s;
animation-duration: 20s;
} */
  @keyframes move-forever {
	0% {
	 transform: translate3d(0%,0,0);
	}
	100% { 
	  transform: translate3d(-50%,0,0);
	}
  }
 /* 
#section1 .ocean { height: 5%;width:100%;position:absolute;bottom:0;left:0; z-index: -1; background: #F2F5F9;}
  
#section1 .wave { background: url(../../images/hfwp/main/wave.svg) repeat-x; position: absolute; top: -198px; width: 3840px; height: 198px; animation: wave 7s cubic-bezier( 0.36, 0.45, 0.63, 0.53) infinite; transform: translate3d(0, 0, 0); opacity: .5;}
 
#section1 .wave:nth-of-type(2) { top: -175px; animation: wave 7s cubic-bezier( 0.36, 0.45, 0.63, 0.53) -.125s infinite, swell 7s ease -1.25s infinite;  }

@keyframes wave {
0% { margin-left: 0; }
100% {	margin-left: -1920px; }
}

@keyframes swell {
0%, 100% { transform: translate3d(0,-25px,0); }
50% { transform: translate3d(0,5px,0);}
}
 */
/* section2 */
#section2 {background: url(../img/main/movie_bg.jpg) 50% 50%/cover no-repeat;color: #fff;}
#section2 h2{margin-bottom: 30px; font-size: 36px;padding-right: 10rem;}
#section2 .movie_link{display: flex;justify-content: space-between;}
#section2 .item{flex:1 1 50%;max-width:50%;}
#section2 .btn_more{position: absolute;right: 0;top: 70px;color: inherit;}
#section2 .btn_more i{margin-left: 10px;}
#section2 .img{display: inline-block;overflow:hidden;border-radius: 2.5rem;position: relative;}
#section2 .img::before {content:''; z-index: 1; position: absolute; left: 0; top: 0; width:100%; height:100%; background: rgba(0,0,0,.46) url(../img/main/icon_feather_play.png) 50% 50% no-repeat;}
#section2 img{vertical-align: top;transition:.3s;}
#section2 a:hover img{transform:scale(1.1);}
#section2 a:hover .refer{text-decoration:underline;}
#section2 .refer{color:#fff;font-size: 20px;display: block;text-align: center;margin-top: 25px;}


@media(max-width: 1023px){
	#visual .slogan{flex-direction: column;}
	#visual .slogan .txt1{margin-right: 0;}
	#section1 .ban_wrap .banBox br{display: none;}
	#section1 .ban_wrap .banBox a{padding-left: 2rem;}
}

@media(max-width: 767px){
	#visual .visual_wrap .visual_ele{position: static;justify-content:center;margin-bottom: 2rem;}
	#visual .visual_slide{margin-right: 2rem;margin-left: 2rem;}
	#visual .visual_slide .item ~ .item{margin-left: 0;}	
	
	#section1 .cont,
	#section2 .movie_link{flex-direction: column;}
	
	#section1 .cont > div,
	#section2 .item{flex:1 1 auto;max-width: 100%;}
	#section1 .cont > div~div,
	#section2 .item~.item{margin-left: 0;margin-top: 4rem;}

	#section1 .ban_wrap .banBox{flex:1 1 100%; max-width:100%;}
	#section1 .ban_wrap .banBox p{padding-right: 5rem;}
	#section1 .cont > div:nth-of-type(2){flex-direction: column;}
	
	#section1 .ban_wrap .banBox:nth-of-type(2){margin-left: 0;margin-top: 2rem;}
}