.pc {display: block;}
.mo {display: none;}

.wrap {width:100%; max-width: 1980px;}
.main_visual {height:100vh; background: url(../images/main/main_bg.jpg) repeat-y center}
/* .item {height: 100vh;} */
.bg_img {height: 100vh;background-repeat: no-repeat;  background-position: center bottom;}
.theme_text .slick-prev {display: none;}
.theme_text .slick-next{z-index: 11;background: url(../images/main/icon-next.jpg) no-repeat center #fff;right: 9%;width: 70px;height: 70px;border-radius: 50px;box-shadow: 0px 0px 9px #ddd;}
.theme_text .slick-next:before {display: none;}
.theme_text .slick-prev:hover,
.theme_text .slick-prev:focus,
.theme_text .slick-next:hover,
.theme_text .slick-next:focus { color: transparent; outline: none; background: url(../images/main/icon-next.jpg) no-repeat center #fff !important; }

.main_visual .inner{position: relative;height: 100vh;max-width: 1980px;margin: 0 auto;padding-left: 270px;}

.main_visual .theme_type_area {
    position: absolute;
    left: calc(50% - 240px);
    bottom: 0;
    height: calc(50% - 100px);
}

.main_visual .theme_type_area .theme_area {position: absolute;left: 0;top: 0;width: 240px;height: 100%;border-radius:0 30px 0 0;z-index: 20;overflow: hidden; background: #fff;}
.main_visual .theme_type_area .theme {color:#fff; letter-spacing: -1px; padding: 15px; height: 100%;}
.main_visual .theme_type_area .theme a {display: block; height:100%}
/* .main_visual .theme_type_area .theme.tm1{background-image: linear-gradient(147deg, #30dbef 0%, #492aee 100%);} */
.main_visual .theme_type_area .theme.tm1{background-color: #ff7700;}
.main_visual .theme_type_area .theme.tm2{background-color: #00b16f;}
.main_visual .theme_type_area .theme.tm3{background-color: #ffb300;}
.main_visual .theme_type_area .theme.tm4{background-color: #0077ff;}
.main_visual .theme_type_area .theme.tm5{background-color: #980ee6;}
.main_visual .theme_type_area .theme h1{font-size: 26px;font-weight: 200;}
.main_visual .theme_type_area .theme h1 > strong{font-weight: 700; }
.main_visual .theme_type_area .theme p{font-size: 16px;font-weight: 200;}

.theme_area .slick-list,
.theme_area .slick-list .slick-track,
.theme_area .slick-track .slick-slide > div {height: 100%;}


.main_visual .theme_type_area .map_type {
    display: flex;
    width: 960px;
    margin-left: 240px;
    height: 100%;
}
.main_visual .theme_type_area .map_type > li { }
.main_visual .theme_type_area .map_type .title {padding: 20px; opacity: 0.6;}
.main_visual .theme_type_area .map_type .title h1{font-size: 26px; letter-spacing: -1px; color: #191919; font-weight: 500;}
.main_visual .theme_type_area .map_type .title p{font-size: 16px;color: #555555; font-weight: 400;}
.main_visual .theme_type_area .map_type div.img{padding-right: 0;}
.main_visual .theme_type_area .map_type div.img.ov {display: none;}
.main_visual .theme_type_area .map_type a:hover .title {opacity: 1;}
.main_visual .theme_type_area .map_type a:hover div.img.off{display: none;}
.main_visual .theme_type_area .map_type a:hover div.img.ov{display: block;}


.theme_wrap {height: 60%; min-height: 600px;}

.theme_text_area { padding-top: 11vh; height: 100%; }
.slick-slider .slick-list, .slick-slider .slick-track{height: 100%;}
.theme_text_area .theme_text{}
.theme_text_area .theme_text .left{ width: 41.5%; float: left;padding: 20px }
.theme_text_area .theme_text .left .title{ }
.theme_text_area .theme_text .left .title p{font-size: 19px;}
.theme_text_area .theme_text .left .title h1{font-size: 58px;font-weight: 300;line-height: 1.2;letter-spacing: -3px;}
.theme_text_area .theme_text .left .title h1 > span{font-weight: 500;}
.theme_text_area .theme_text .left .title .txt {font-size:22px;margin-top: 20px;}

/* .theme_text_area .theme_text.tm1 .title h1 > span{color: #492aee; } */
.theme_text_area .theme_text.tm1 .title h1 > span{color: #ff7700; }
.theme_text_area .theme_text.tm2 .title h1 > span{color: #00b16f; }
.theme_text_area .theme_text.tm3 .title h1 > span{color: #ffb300; }
.theme_text_area .theme_text.tm4 .title h1 > span{color: #0077ff; }
.theme_text_area .theme_text.tm5 .title h1 > span{color: #980ee6; }

.theme_text_area .theme_text .right {width: 58.5%;float: right;padding: 20px;position: relative;padding-top: 50px;}
.theme_text_area .theme_text .right h1{font-size:10px;color:#474645;letter-spacing: 2px;}
.theme_text_area .theme_text .right h2{font-size:10px;letter-spacing: 2px; margin-top: 20px; }
.theme_text_area .theme_text .right .txt_bg{font-size: 106px;letter-spacing: -10px;line-height: 127px;color: #e8ebf1;font-weight: 300;padding-left: 135px;}

/* .theme_text_area .theme_text.tm1 .right h2 {color: #492aee; } */
.theme_text.tm1 .right h2 {color: #ff7700; }
.theme_text.tm1 .right .img_area div.tt {background-color: #ff7700;}
.theme_text.tm2 .right h2 {color: #00b16f; }
.theme_text.tm2 .right .img_area div.tt {background-color: #00b16f;}
.theme_text.tm3 .right h2 {color: #ffb300; }
.theme_text.tm3 .right .img_area div.tt {background-color: #ffb300;}
.theme_text.tm4 .right h2 {color: #0077ff; }
.theme_text.tm4 .right .img_area div.tt {background-color: #0077ff;}
.theme_text.tm5 .right h2 {color: #980ee6; }
.theme_text.tm5 .right .img_area div.tt {background-color: #980ee6;}


.theme_text_area .theme_text .right .theme_menu {position: absolute;left: 240px;top: 0;padding-left: 20px;}
.theme_text_area .theme_text .right .theme_menu > h1 {font-size: 26px;color: #191919;letter-spacing: -2px;margin-bottom: 50px;}
.theme_text_area .right .img_area {width: 720px;height:383px; overflow: hidden; position: absolute; top:0; left:250px;}
.theme_text_area .right .img_area div.tt {position: absolute;left: 0; top: 0;width: 145px;height: 152px;color: #fff;display: flex;flex-direction: column;justify-content: flex-end;align-items: flex-start;padding: 15px 10px;}
.theme_text_area .right .img_area div.tt > span {font-size: 11px;opacity: 0.6;letter-spacing: 2px;}
.theme_text_area .right .img_area div.tt > h1 {font-size: 16px; font-weight: 700; color: #fff;}
.theme_text_area .right .img_area div.tt > h2 {margin: 0;color: #fff;letter-spacing: 1px;}
.theme_text_area .right .img_area img {max-width: 100%;}












.theme_text_area .slick-dots {text-align: left; margin-left: 15px;}
.theme_text_area .slick-dots li.slick-active {margin-right: 20px;}
.theme_text_area .slick-dots li.slick-active button:before {width: 35px;height: 35px;color: transparent;top: -10px;}
.theme_text_area .slick-dots li:nth-child(1).slick-active button:before {background: url(../images/main/dot02.jpg) no-repeat center }
.theme_text_area .slick-dots li:nth-child(2).slick-active button:before {background: url(../images/main/dot03.jpg) no-repeat center }
.theme_text_area .slick-dots li:nth-child(3).slick-active button:before {background: url(../images/main/dot04.jpg) no-repeat center }
.theme_text_area .slick-dots li:nth-child(4).slick-active button:before {background: url(../images/main/dot05.jpg) no-repeat center }
.theme_text_area .slick-dots li:nth-child(5).slick-active button:before {background: url(../images/main/dot06.jpg) no-repeat center }

.theme_text_area .slick-prev {display: none;}
.theme_text_area .slick-next{z-index: 11;background: url(../images/main/icon-next.jpg) no-repeat center #fff;top: 60%;right: -45px;width: 70px;height: 70px;border-radius: 50px;box-shadow: 0px 0px 9px #ddd;}
.theme_text_area .slick-next:before {display: none;}
.theme_text_area .slick-prev:hover,
.theme_text_area .slick-prev:focus,
.theme_text_area .slick-next:hover,
.theme_text_area .slick-next:focus
{
    color: transparent;
    outline: none;
    background: url(../images/main/icon-next.jpg) no-repeat center #fff !important;
}



/* @keyframes aa {
    0 {opacity: 1;}
    50% {opacity: 0; }
    100% {opacity: 1;}
} */

/* @keyframes bb {
    0 {opacity: 0;}
    50% {opacity: 1; }
    100% {opacity: 0;}
} */

@media (max-width: 1920px) {
    * {transition: padding-left 0.8s, width 0.8s;}
    .main_visual .inner{padding-left: 270px;}
}
@media (max-width: 1600px) {
    /* .main_visual .inner{padding-left: calc(15% - 5vh)} */
    .main_visual .inner{padding-left: 2vh}
}
@media (max-width: 1440px) {
    /* .main_visual .inner{padding-left: calc(12% - 5vh)} */
    .main_visual .theme_type_area {left: calc(40% - 240px);}
}
@media (max-width: 1200px) {
    .main_visual {background: none;}
    .main_visual .inner {display:block}
    /* .main_visual .inner{padding-left: calc(10% - 5vh)} */
    .theme_wrap{height: auto;}
    .theme_text_area .theme_text .left{ width: 100%; }
    .theme_text_area .slick-dots {bottom: 200px;}
    .theme_text_area .theme_text .right {width: 100%; height: 383px;}
    .theme_text_area .right .img_area {height: 100%; overflow: hidden;}
    .main_visual .theme_type_area {position: relative; left: 0;}

}
@media (max-width: 1024px) {
    .m_theme_text_area .theme_text{ height: 100vh; background-repeat: no-repeat; position: relative;}
}
@media (max-width: 768px) {
    .pc {display: none;}
    .mo {display: block;}

    .m_theme_text_area { }
    .m_theme_text_area .theme_text{ height: 100vh; background-repeat: no-repeat; position: relative;}
    .m_theme_text_area .theme_text.tm1{
        background-image: linear-gradient(145deg, rgb(255 139 38 / 80%) 0%, rgb(255 119 0 / 80%) 100%), url(../images/main/m_tm_img1_bg.png);
    }
    .m_theme_text_area .theme_text.tm2{
        background-image: linear-gradient(145deg, rgb(96 229 179 / 80%) 0%, rgb(0 177 111 / 80%) 100%), url(../images/main/m_tm_img2_bg.png);
    }
    .m_theme_text_area .theme_text.tm3{
        background-image: linear-gradient(145deg, rgb(255 192 42 / 0.8) 0%, rgb(255 179 0 / 0.8) 100%), url(../images/main/m_tm_img3_bg.png);
    }
    .m_theme_text_area .theme_text.tm4{
        background-image: linear-gradient(145deg, rgb(132 189 255 / 0.8) 0%, rgb(0 119 255 / 0.8) 100%), url(../images/main/m_tm_img4_bg.png);
    }
    .m_theme_text_area .theme_text.tm5{
        background-image: linear-gradient(145deg, rgb(226 125 251 / 0.8) 0%, rgb(152 14 230 / 0.8) 100%), url(../images/main/m_tm_img5_bg.png);
    }
    .m_theme_text_area .theme_text .title_area{
        color: #ffffff;
        padding: 5vh 5vh 10vh;
        height: 50%;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
    }
    .m_theme_text_area .theme_text .title_area p{opacity: 0.5;letter-spacing: 2px;font-size: 9px;font-weight: 500;}
    .m_theme_text_area .theme_text .title_area h1{
        opacity: 0.949;
        font-size: 32px;
        letter-spacing: -2px;
        font-weight: 700;
    }
    .m_theme_text_area .theme_text .title_area h1 > button{
        opacity: 0.651;
        padding: 1vh 3vh;
        height: 26px;
        border-radius: 13px;
        filter: drop-shadow(0px 3px 3.5px rgba(0,0,0,0.16));
        background-color: #fbfbfb;
        font-size: 12px;
        font-weight: 700;
        line-height: 0;
    }
    .m_theme_text_area .theme_text .title_area h1 > button > i{ margin-left: 1rem; }
    .m_theme_text_area .theme_text.tm1 .title_area h1 > button{color:#ff7700;}
    .m_theme_text_area .theme_text.tm2 .title_area h1 > button{color:#00b16f}
    .m_theme_text_area .theme_text.tm3 .title_area h1 > button{color:#ffb300}
    .m_theme_text_area .theme_text.tm4 .title_area h1 > button{color:#0077ff}
    .m_theme_text_area .theme_text.tm5 .title_area h1 > button{color:#980ee6}

    .m_theme_text_area .theme_text .title_area div.txt{
        opacity: 0.761;
        font-size: 14px;
        line-height: 22px;
        font-weight: 400;
        letter-spacing: 0;
    }

    .m_theme_text_area .theme_text .img_area{
        opacity: 0.949;
        background-color: #ffffff;
        width: 100%;
        height: 250px;
        border-radius: 0 40px 0 0;
        padding: 4vh 2vh;
        /*position: absolute;*/
        bottom: 0px;
    }
    .m_theme_text_area .theme_text .img_area ul {
        display: flex !important;
        justify-content: space-around;
        margin: 0 -1vh;
    }
    .m_theme_text_area .theme_text .img_area ul > li {margin: 0 0.85vh;}
    .m_theme_text_area .theme_text .img_area ul > li > div.img{margin-bottom: 1vh;}
    .m_theme_text_area .theme_text .img_area ul > li > h2 {
        font-size: 15px;
        letter-spacing: -1px;
        color: #343643;
        font-weight: 500;
        text-align: center;
    }
    .m_theme_text_area .theme_text .img_area ul > li > p {
        font-size: 10px;
        letter-spacing: 0px;
        line-height: 17px;
        color: #ff7700;
        font-weight: 500;
        border-radius: 10px;
        background-color: rgb(255 119 0 / 26%);
        width: 72px;
        height: 20px;
        text-align: center;
    }
    .m_theme_text_area.slick-dotted.slick-slider{margin-bottom: 0 !important;}
    .m_theme_text_area .slick-dots{ position: absolute; bottom: 55%; display: block; width: 50%; padding: 0; margin-left: 5vh; list-style: none; text-align: left; }
    .m_theme_text_area .slick-dots li {margin: 0;}
    .m_theme_text_area .slick-next{right: 5vh;top: 35%;width: 50px;height: 50px; background: url(../images/main/icon-next.jpg)no-repeat #fff center !important; border-radius: 50px;}
    .m_theme_text_area .slick-next::before{display: none;}

}
@media (max-width: 640px) {
    .m_theme_text_area .theme_text{ height: 87vh; background-repeat: no-repeat; position: relative;}
}
@media (max-width: 576px) {
    .m_theme_text_area .theme_text{ height: 85vh; background-repeat: no-repeat; position: relative;}
}
@media (max-width: 440px) {
    .m_theme_text_area .theme_text{ height: 83vh; background-repeat: no-repeat; position: relative;}
}