@charset "utf-8";

#cboxOverlay {position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.8); z-index:200;}
#colorbox {z-index:250; }
.cboxPhoto {max-width:1000px !important; height:auto !important;}
#cboxCurrent,
#cboxPrevious,
#cboxNext,
#cboxClose { position:absolute; bottom:0; width:40px; height:40px; background:rgba(0,0,0,0.8) url('/design/icevalley/img/main/viewBtn.gif') no-repeat 0 0; border:0; text-indent:-99999px; }
#cboxCurrent { width:70px; line-height:40px; text-align:center; color:#fff; background:rgba(0,0,0,0.8); right:123px; text-indent:0;  }
#cboxPrevious { right:82px;}
#cboxNext {background-position:-120px 0; right:41px}
#cboxClose {background-position:-160px 0; right:0;}

a.swiper-button-disabled {opacity:0.5;}

.cont1 { border-radius:30rem; overflow:hidden; box-shadow:10rem 10rem 10rem rgba(0,0,0,0.07); margin-top:30rem; }
.visual { position:relative; float:left; width:50%; background:#000; overflow:hidden; }
.visual .controls { position:absolute; right:30rem; top:30rem; background:rgba(0,0,0,0.5); padding:8rem 15rem; border-radius:20rem; z-index:2; }
.visual .controls a {display:block; float:left; width:25rem; height:25rem; background:url('/design/icevalley/img/main/controls.png') no-repeat 0 0/300% auto; text-indent:-999999px;  }
.visual .controls a.stop {background-position:50% 0;}
.visual .controls a.play { display:none; background-position:100% 0;}
.visual .controls a.next { transform:rotate(180deg);}
.visual .txt_wrap { position:absolute; left:0; top:50%; width:100%; transform:var(--hcenter); text-align:center; color:#fff; z-index:2; }
.visual_slide img {width:100%; height:100%; object-fit:cover; opacity:0.8; }
.visual .txt_wrap .txt1 { font-weight:300; letter-spacing:4rem; }
.visual .txt_wrap .txt2 { font-size:45rem; font-weight:700; }
.visual .txt_wrap .txt3 { font-size:21rem; }
.visual_slide {z-index:1;}
.visual_slide div {height:610rem;}
@media all and (max-width:1200px){
    .visual {width:100%;}
}
@media all and (max-width:768px){
    .visual_slide div {height:450rem;}
}
@media all and (max-width:480px){
    .visual_slide div {height:330rem;}
}

.btn_wrap1 { position:relative; float:left; width:50%; }
.btn_wrap1::before,
.btn_wrap1::after { content:''; position:absolute; left:50%; top:0; width:1px; height:100%; background:#dedede; z-index:10; }
.btn_wrap1::after { left:0; top:50%; width:100%; height:1px; }
.btn_wrap1 a { position:relative; float:left; width:50%; height:215rem; background:#fff; padding:30rem; }
.btn_wrap1 a span.shadow {position:absolute; right:38rem; bottom:30rem; width:50rem; height:6rem; border-radius:100%; background:rgba(184, 172, 234, 0.8); }
.btn_wrap1 a::after {content:''; position:absolute; right:30rem; bottom:30rem; width:70rem; height:70rem; background:url('/design/icevalley/img/main/icon1.png') no-repeat 0 0/200% auto; }
.btn_wrap1 a.icon2::after {background-position:100% 0;}
.btn_wrap1 a.icon3::after {background-position:0 100%;}
.btn_wrap1 a.icon4::after {background-position:100% 100%;}
.btn_wrap1 a::before { content:''; position:absolute; left:10rem; bottom:40rem; width:24rem; height:12rem; background:url('/design/icevalley/img/main/arrow.png') no-repeat center/cover; opacity:0; transition:0.5s; }
.btn_wrap1 a dt {font-size:22rem; font-weight:700; margin-bottom:10rem; }
.btn_wrap1 a dd {color:var(--g_txt); }
.btn_wrap1 a dd span {display:block;}
@media (max-width:1200px) and (min-width:1024px){
    .btn_wrap1 {width:100%;}
    .btn_wrap1 a {width:25%; border-left:1px solid #dedede; }
    .btn_wrap1 a:first-of-type {border-left:0;}
    .btn_wrap1::before, .btn_wrap1::after {display:none;}
}
@media all and (max-width:1023px) {
    .btn_wrap1 {width:100%;}
}
@media all and (max-width:480px) {
    .btn_wrap1 a {padding:20rem;}
    .btn_wrap1 a::after,
    .btn_wrap1 a span.shadow {display:none;}
    .btn_wrap1 a::before { left:30rem; opacity:1;}
    .btn_wrap1 a dd span {display:inline;}
}

.btn_wrap1 a:hover::before {left:30rem; opacity:1;}
.btn_wrap1 a:hover::after { animation:icon1 1s infinite;}
.btn_wrap1 a:hover span.shadow { animation:shadow 1s infinite;}
@keyframes icon1 {
    0% {
        bottom: 30rem;
    }
    50% {
        bottom: 45rem;
    }
    65% {
        bottom: 45rem;
    }
    95% {
        bottom: 30rem;
    }
    100% {
        bottom: 30rem;
    }
}
@keyframes shadow {
    0% {
        transform: scale(0.1);
        background-color: rgba(184, 172, 234, 0.8);
  	}
    50% {
        transform: scale(1);
        background-color: rgba(184, 172, 234, 0.9);
    }
    65% {
        transform: scale(1);
        background-color: rgba(184, 172, 234, 0.9);
    }
    95% {
        transform: scale(0.1);
        background-color: rgba(184, 172, 234, 0.8);
    }
    100% {
        transform: scale(0.1);
        background-color: rgba(184, 172, 234, 0.8);
    }
}

.btn_wrap2 {float:left; width:50%; }
.btn_wrap2 a { position:relative; display:block; float:left; width:50%; height:180rem; background:#4284db; color:#fff; padding:30rem 0 0 150rem; }
.btn_wrap2 a::before {content:''; position:absolute; left:40rem; top:40rem; width:80rem; height:80rem; background:rgba(0,0,0,0.1); border-radius:50%; }
.btn_wrap2 a::after {content:''; position:absolute; left:60rem; top:60rem; width:40rem; height:40rem; background:url('/design/icevalley/img/main/icon2.png') no-repeat 0 0/200% auto; }
.btn_wrap2 a:nth-of-type(2) {background:#41aec5; }
.btn_wrap2 a:nth-of-type(2)::after {background-position:100% 0;}
.btn_wrap2 a dt {font-size:22rem; font-weight:700; margin-bottom:15rem; }
.btn_wrap2 a dd {font-weight:300; }
.btn_wrap2 a dd span {display:block; }
@media (max-width:1400px) and (min-width:1201px){
    .btn_wrap2 a {padding:30rem 0 0 100rem;}
    .btn_wrap2 a::before {left:20rem; width:60rem; height:60rem; }
    .btn_wrap2 a::after { top:55rem; left:35rem; width:30rem; height:30rem; }
}
@media all and (max-width:1200px){
    .btn_wrap2 {width:100%;}
}
@media all and (max-width:768px){
    .btn_wrap2 a {padding:30rem 0 0 70rem; height:120rem; }
    .btn_wrap2 a::before {display:none;}
    .btn_wrap2 a::after {left:20rem; top:30rem; }
    .btn_wrap2 a dd {display:none;}
}
@media all and (max-width:480px){
    .btn_wrap2 a dt {font-size:20rem; }
}

.notice {position:relative; overflow:hidden; margin:70rem 0; min-height:210rem;}
.notice h2 { float:left; width:350rem; font-size:33rem; line-height:1.4; }
.notice h2 span { display:block; font-size:21rem; font-weight:400; margin-bottom:10rem;}
.notice h2 strong.blue {display:block; color:var(--blue); }
.notice a.more {position:absolute; left:0; bottom:20rem; color:var(--blue); border-bottom:2px solid var(--blue); padding:0 40rem 10rem 0; font-weight:500;}
.notice a.more::after {content:''; position:absolute; right:5rem; bottom:-5rem; width:2px; height:20rem; transform:rotate(-45deg); background:var(--blue);}
.notice dl { float:right; width:calc(100% - 350rem); border-top:2px solid #e9e9e9; border-bottom:2px solid #e9e9e9; padding:30rem; }
.notice dt { margin-bottom:20rem; font-size:22rem; font-weight:700; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
.notice dd p { color:var(--g_txt); }
.notice dd p:not(.date) {  line-height:30rem; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient: vertical; text-overflow: ellipsis; max-height:60rem; overflow:hidden; margin-bottom:30rem;}
@media all and (max-width:1023px){
    .notice h2 {width:100%; margin-bottom:20rem; }
    .notice h2 span {display:none;}
    .notice h2 strong.blue {display:inline;}
    .notice dl {width:100%;}
    .notice a.more { left:auto; bottom:auto; top:0; right:0; }
}
@media all and (max-width:480px){
    .notice h2 strong:not(.blue) {display:none;}
}

.btn_wrap3 {overflow:hidden; margin:70rem 0;}
.btn_wrap3 dl { position:relative; float:left; width:33.33%; padding:10rem 0 10rem 165rem; }
.btn_wrap3 dl::before { content:''; position:absolute; left:0; top:50%; width:150rem; height:150rem; background:url('/design/icevalley/img/main/icon3.png') no-repeat 0 0/300% auto; transform:var(--hcenter);}
.btn_wrap3 dl.icon2::before { background-position:50% 0;}
.btn_wrap3 dl.icon3::before { background-position:100% 0;}
.btn_wrap3 dl dt { font-size:22rem; font-weight:700; }
.btn_wrap3 dl dd p {color:var(--g_txt); margin:5rem 0 10rem;}
.btn_wrap3 a { display:inline-block; color:#fff; background:#333; padding:3rem 15rem; border-radius:20rem; font-size:16rem; transition:0.3s;}
.btn_wrap3 a:hover { background:var(--blue); }
@media (max-width:1200px) and (min-width:481px){
    .btn_wrap3 dl {padding:165rem 0 0; text-align:center;}
    .btn_wrap3 dl::before { left:50%; top:0; transform:var(--wcenter);}
}
@media all and (max-width:480px){
    .btn_wrap3 dl {width:100%; margin-top:30rem;}
    .btn_wrap3 dl:first-of-type {margin-top:0;}
}

.facility { position:relative; padding-bottom:80rem; }
.facility::before {content:''; position:absolute; left:-60rem; bottom:20rem; width:calc(25% - 20rem); height:300rem; border:2px solid #e9e9e9; border-radius:30rem; }
.facility .title { overflow:hidden; margin-bottom:50rem; }
.facility .title dt { font-size:33rem; float:left; font-weight:700; }
.facility .title dd {float:left; color:var(--g_txt); padding:15rem 0 0 35rem;}
.facility .controls a { position:absolute; display:block; left:0; bottom:0; width:50rem; height:50rem; border-radius:50%; background:var(--blue); text-indent:-999999px; }
.facility .controls a::before {content:''; position:absolute; left:42%; top:40%; width:6rem; height:6rem; border-top:4rem solid #fff; border-left:4rem solid #fff; transform:rotate(-45deg); }
.facility .controls a.next { left:60rem; transform:rotate(180deg); }
.facility .swiper {overflow:hidden; }
.facility_slide a { position:relative; height:300rem; border-radius:30rem; overflow:hidden; }
.facility_slide a::before {content:''; position:absolute; left:0; bottom:0; width:100%; height:50%; background:linear-gradient(180deg, transparent 0%, #000 100%); opacity:0; transition:0.5s; }
.facility_slide a:hover::before { opacity:0.5; }
.facility_slide strong { position:absolute; left:30rem; bottom:10rem; color:#fff; font-size:22rem; opacity:0; transition:0.3s; }
.facility_slide a:hover strong { bottom:20rem; opacity:1 }
.facility_slide img { width:100%; height:100%; object-fit:cover; }
@media all and (max-width:1023px){
    .facility .title dt {float:none;}
    .facility .title dd {float:none; padding:0; }
}
