@charset "UTF-8";

.smartphone{
    padding-top: 0!important;
}
.sec01{
    position: relative;
    color: #FFF;
}

.sec01_01{
    position: absolute;
    top: 0;
    width: 100%;
    height: auto;
    z-index: -1;
}
.sec01_copy{
    padding: 620px 45px 50px;
}
.sec01_con{
    margin: 0 20px;
    position: relative;
}
.sec01_con h2{
    margin: 0 0 400px;
}
.sec01_con img{
    position: absolute;
    top: 130px;
    left: 0;
    right: 0;
    margin: 0;
    z-index: -1;
}
.sec01_con{
    margin-bottom: 170px;
}
.sec01 .font18{
    font-weight: 300;
}


.sec02{
    background: linear-gradient(to bottom, #0AB3CB, #E847EB);
}
.sec02_con{
    padding: 0 0 130px;
}
.sec02_con_{
    padding: 0 20px;
}
.sec02 .sec02_01{
    width: 480px;
    margin: 75px 5px 35px;
}
.sec02 .sec02_02{
    margin: 0 0 35px;
}
.sec02 p{
    margin: 0 0 70px;
}
.sec02 .sec02_03{
    width: 438px;
    margin: 0 auto;
    padding-bottom: 90px;
    display: block;
}
.sec02_con .slick-slide{
  padding: 0 20px;
}
.sec02_con .slick-dots li:before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url("../images/sec02_con_btn01.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
  margin-left: 10px;
  border: solid 0 #000!important;
  background-color: transparent;
}

.sec02_con .slick-dots .slick-active:before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url("../images/sec02_con_btn02.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
  margin-left: 10px;
  border: solid 0 #000!important;
  background-color: transparent;
}

.sec02_con .slick-list{
height: 300px!important;
}



.sec03{
    position: relative;
}
.sec03_01{
    position: absolute;
    top: 0;
    z-index: -1;
}
.sec03_02{
    width: 265px;
    display: block;
    margin: 100px auto 40px;
}
.sec03_con{
    padding: 100px 20px 0;
    color: #FFF;
}
.sec03_con h2{
    font-size: 28px;
    margin-bottom: 410px;
    font-weight: 600;
    letter-spacing: 4px;
}
.sec03_con ul li{
    margin-bottom: 40px;
}
.sec03_con ul li:last-child{
    margin-bottom: 80px;
}
.sec03 .slick-initialized .slick-slide{
    padding: 0 10px;
}
.sec03 .slick-dots{
    display: none!important;
}
.sec03 .slick-list{
    height: 380px!important;
}


.sec04{
    position: relative;
    background: linear-gradient(to bottom, #8ABBE3, #E847EB);
}
.sec04_title{
    position: absolute;
    width: 335px;
    top: -30px;
    right: 105px;
    margin: 0;
    z-index: 5;
}
.sec04 h2{
    padding: 40px 0 0;
    margin-bottom: 30px;
}
.sec04_copy{
    font-size: 28px;
    font-weight: 600;
    margin-bottom: 80px;
}
.sec4_con{
    margin: 0 5px 0 25px;
    padding-bottom: 50px;
    justify-content: space-between;
    padding-bottom: 50px;
    display: flex;
    justify-content: space-between;
}
.sec4_con img{
    width: 235px;
    border-radius: 20px;
    margin-bottom: 30px;
    box-shadow: 3px 3px 20px rgba(0, 152, 165, 0.5);

}
.sec4_con div:nth-child(2){
    margin-top: 80px;
}

.main {
    background-image: url("../images/main_img.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100vw;
    height: 100vh;
  }
.pc_copy{
    color: #FFF;
}
.pc_img{
    width: 25vw;
    max-width: 875px;
}
.pc_copylight{
    color: #FFF;
}
.pc_copylight p{
    color: #FFF!important;
}
.pc_menu_li a{
    color: #FFF;
}
.gnavi__list a{
    color: #FFF;
}
.arrow:after{
    background-image: url(../images/arrow.png);
}
.gnavi__list a{
    color: #000;
}
.gnavi__list .arrow{
    color: #FFF;
}
.gnavi__list a:hover {
    color: #984FFF;
}
.pc_menu_li a:hover{
    color: #984FFF;
}

.ft_btn{
    position: fixed;
    bottom: 190px;
    right: 20px;
    width: 90px;
}