@charset "utf-8";

/* main */
.visual {}
.slide_wrap {overflow: hidden; position: relative; height: 620px;}
.slide_wrap .slide {position: relative; height: 620px; background-repeat:no-repeat; background-size: cover; background-position: center;}
.slide_wrap .slide.slide01 {background-image: url(../images/main/slide01.jpg);}
.slide_wrap .slide.slide02 {background-image: url(../images/main/slide02.jpg);}
.slide_wrap .slide.slide03 {background-image: url(../images/main/slide03.jpg);}
.slide_wrap .slide .m_slide {position: relative;}
.slide_wrap .slick-active figcaption em{opacity: 1;transform: translateX(0);}
.slide_wrap .slick-active figcaption span{opacity: 1;transform: translateX(0);}
.slide_wrap .slick-dots {position: absolute; bottom: 25px; left: 0; width: 100%; text-align: center; font-size: 0;}
.slide_wrap .slick-dots li {display: inline-block;}
.slide_wrap .slick-dots li button {display: block;width: 15px;height: 15px;margin:0 5px; border: 2px solid #fff; border-radius:50%; background: transparent; font-size: 0; line-height: 0; cursor: pointer; box-sizing: border-box;}
.slide_wrap .slick-dots li.slick-active button {background: #fff;}
.slide_wrap .slick-arrow {position: absolute; top: 50%; z-index: 50; width: 80px; height: 80px; background: url(../images/common/m_arrow.png) no-repeat; text-indent: -9999px; transform: translateY(-50%); cursor: pointer;}
.slide_wrap .slick-arrow.slick-prev {left: 82px;}
.slide_wrap .slick-arrow.slick-next {right: 82px;transform: translateY(-50%) rotate(180deg);}
.slide_wrap .slide .txt_box {position: absolute; left: 52px; top: 50%;transform: translateY(-50%);}
.slide_wrap .slide .txt_box .top_box {display: inline-block; width:109px; height: 32px; border-radius: 20px; background: #fff; font-weight: bold; font-size: 17px; color: #fff; text-align: center; line-height: 32px;}
.slide_wrap .slide .txt_box h3 {padding:16px 0; font-weight: bold; font-size: 34px; color: #fff; line-height: 43px;}
.slide_wrap .slide .txt_box p {padding:0 0 40px; font-size: 16px; line-height: 26px; color: #fff; }
.slide_wrap .slide .txt_box .detail {display: inline-block; width: 138px; height: 34px; text-align: center; color: #fff; line-height: 34px;}

/* menu_bar */
.menu_bar {background: #999;}
.menu_bar ul {font-size: 0; }
.menu_bar ul li {display: inline-block; width:33.3333%; height:54px; }
.menu_bar ul li a {display: block; width: 100%; height: 100%; font-size: 24px; color:#fff; font-weight: bold; text-align: center; line-height: 54px;}

/* content01 */
.content01 {overflow: hidden; padding:0 0 77px; }
.content01 h2 {padding: 82px 0 40px; font-size: 36px; font-weight: bold; text-align: center; line-height: 100%;}
.content01 .s1_box {border: 1px solid #ddd; box-sizing: border-box;}
.content01 .s1_box a {display: block; }
.content01 .slick-slide {overflow: hidden; width: 383px; margin:0 16px 0 0;} /* margin:0 16px 0 0; */
/* .content01 .slick-slide:nth-child(3n) {margin: 0; } */
/* .content01 .slick-slide [data-slick-index = "2n"] {margin:0;} */

.content01 .s1_box a > div {padding: 37px 30px;}
.content01 .s1_box h4 {padding-bottom: 13px; font-size: 18px;}
.content01 .s1_box h3 {position: relative; padding:0 0 17px; font-size: 19px; font-weight: bold; line-height: 29px;}
/* .content01 .s1_box h3:after {content: ""; position: absolute; bottom: 0; left: 0; width: 40px; height: 4px; background: #ee2c49;} */
.content01 .s1_box p {padding: 25px 0 0; font-size: 15px; line-height: 100%; }
.content01 .s1_slider {position: relative;}
.content01 .s1_slider .slick-arrow {position: absolute; top: 30%; z-index: 50; width: 60px; height: 101px;  text-indent: -9999px; transform: translateY(-50%); cursor: pointer; }
.content01 .s1_slider .slick-arrow.slick-prev {left: 0; background: url(../images/common/c_arrow_l.png) no-repeat;}
.content01 .s1_slider .slick-arrow.slick-next {right: 13px; background: url(../images/common/c_arrow_r.png) no-repeat;}
.content01 .s1_slider .slick-dots {position: absolute; top: -55px; right: 0;font-size: 0;}
.content01 .s1_slider .slick-dots li {display: inline-block;}
.content01 .s1_slider .slick-dots li button{display: block; width: 14px; height: 14px; margin: 0 3px; border-radius:50%;background:#f9b5bf;font-size: 0;line-height: 0;cursor: pointer;}
.content01 .s1_slider .slick-dots li.slick-active button {background: #ee2c49;}


/* content02 */
.content02 {overflow: hidden; padding: 88px 0; background: #f5f5f5;  box-sizing: border-box;}
.content02 .cont2_txt {padding: 30px 35px 43px; background: #fff;}
.content02 h2 {padding: 0 0 20px; font-size: 36px; font-weight: bold; }
.content02 h3 {overflow: hidden; padding: 13px 0; font-size: 26px; font-weight: bold; line-height: 30px; text-overflow: ellipsis; white-space: nowrap;}
.content02 h4 {font-size: 18px; }
.content02 p {line-height: 24px; }
/* .content02 .left {float: left; width: 555px;} */
.content02 .left {float: left; width: 47%; margin-right:5%; }
.content02 .left .s2_box {border: 1px solid #ddd; box-sizing: border-box;}
.content02 .left .slick-arrow {position: absolute; top: 30%; z-index: 50; width: 60px; height: 101px; text-indent: -9999px; transform: translateY(-50%); cursor: pointer;}
.content02 .left .slick-arrow.slick-prev {left: 0;background: url(../images/common/c_arrow_l.png) no-repeat;}
.content02 .left .slick-arrow.slick-next {right: 0; background: url(../images/common/c_arrow_r.png) no-repeat;}
.content02 .left .slick-dots {position: absolute; top: -55px; right: 0; font-size: 0;}
.content02 .left .slick-dots li {display: inline-block;}
.content02 .left .slick-dots li button{display: block; width: 14px; height: 14px; margin: 0 3px; border-radius:50%;background:#a6cadf;font-size: 0;line-height: 0;cursor: pointer;}
.content02 .left .slick-dots li.slick-active button {background: #0068a4;}
/* .content02 .right {float: right; width: 555px; } */
.content02 .right {float: right; width: 47%; margin-right: 0; text-align: left;}
.content02 .right .s3_box {border: 1px solid #ddd; box-sizing: border-box;}
.content02 .right .slick-arrow {position: absolute; top: 30%; z-index: 50; width: 60px; height: 101px; text-indent: -9999px; transform: translateY(-50%); cursor: pointer;}
.content02 .right .slick-arrow.slick-prev {left: 0;background: url(../images/common/c_arrow_l.png) no-repeat; }
.content02 .right .slick-arrow.slick-next {right: 0; background: url(../images/common/c_arrow_r.png) no-repeat; }
.content02 .right .slick-dots {position: absolute; top: -55px; right: 0; font-size: 0;}
.content02 .right .slick-dots li {display: inline-block;}
.content02 .right .slick-dots li button{display: block; width: 14px; height: 14px; margin: 0 3px; border-radius:50%;background:#daccc9;font-size: 0;line-height: 0;cursor: pointer;}
.content02 .right .slick-dots li.slick-active button {background: #956c64;}





/* ---------------- MEDIAQUERY --------------------   */

@media all and (max-width:1024px) {

}

@media all and (max-width:768px) {
    .slide_wrap,
    .slide_wrap .slide {height: 500px;}
    .slide_wrap .slide.slide01 {background-image: url(../images/main/m_banner_1.jpg);}/* slide01_mo */
    .slide_wrap .slide.slide02 {background-image: url(../images/main/m_banner_2.jpg);}
    .slide_wrap .slide.slide03 {background-image: url(../images/main/m_banner_3.jpg);}
    .slide_wrap .slide .txt_box {width: 80%; left: 7%; top: 10%; transform: none; }
    .slide_wrap .slide .txt_box.mhide {display: none; }
    .slide_wrap .slide .mshw {display: block; width: 100%; height: 100%; }
    .content01 .slick-slide {margin: 0; }
    .slide_wrap .slick-arrow,
    .slide_wrap .slick-arrow.slick-prev,
    .slide_wrap .slick-arrow.slick-next { display: none !important; }
    .content01 .s1_slider {width:100% !important;}
    .slide_wrap .slide .txt_box .top_box {display: none; }
    .slide_wrap .slide .txt_box h3 {font-size: 26px; line-height: 40px; } /* font-size: 28px; */
    .menu_bar ul li {height:60px;}
    .menu_bar ul li a {font-size: 20px; line-height: 60px;}

    .content01 .s1_slider .slick-arrow.slick-next {right: 0; }
    .content01 h2 {text-align: left;}
    .content02 {padding:70px 0;}
    .content02 .cont2_txt {padding: 20px 30px 33px}
    .content02 .left {float: right; width: 100%; margin-bottom: 35px; margin-right: 0;}
    .content02 .right {float: right; width: 100%; margin-right: 0;}

}

@media all and (max-width:640px) {

}

@media all and (max-width:450px) {

    .menu_bar ul li {width: 100%;}
    .menu_bar ul li a {font-size: 18px;}
    .content02 .cont2_txt {padding: 20px 10px 25px}
    .slide_wrap,
    .slide_wrap .slide {height: 390px;}

}

@media all and (max-width:320px) {

}