@charset "utf-8";
/*@latest 2021.01.14 SSJ */

/* main visual */
.mainVisual .swiper-container.mainSlider_001 {/* height:100vh; */background:white;z-index:0;overflow:hidden;transition: height 1s;}
.mainVisual .swiper-slide {position:relative; overflow:hidden;}
.mainVisual .swiper-slide > img {min-width:100%; min-height:100%; position:absolute; top:-999px; bottom:-999px; left:-999px; right:-999px; margin:auto;}

  

/*copy*/
.copy {position:absolute;z-index:9;width:100%;word-break:keep-all; top:30% !important;}
.copy .inner {width:100%; max-width:1300px; padding:0; margin:0 auto; box-sizing:border-box;}
.copy h3 {font-weight:400;line-height: 1em;color:#fff;transition: font-size 0.5s;}
.copy h3 strong {font-weight:600; line-height:150%;}
.copy p.smallp {font-size:20px;line-height:1.5em;padding-top:30px;color:white;font-weight:400;transition: font-size 0.5s;}

.basic013_morebtn {
        padding: 20px 45px !important;
        border-radius: 35px !important;
        display:inline-block;
        font-size:18px;
        background: #99c144 !important;
        color: #fff !important;
        margin-top:50px;
        transform: perspective(1px) translateZ(0);
        overflow:hidden;
        line-height: 1.2em !important;
        height: auto !important;
        }
.basic013_morebtn:before {content: "";position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background:#00549d;
              -webkit-transform:scaleX(0); transform:scaleX(0);
              -webkit-transform-origin:0 50%; transform-origin:0 50%;
              -webkit-transition-property:transform; transition-property:transform;
              -webkit-transition-duration:0.5s; transition-duration:0.5s;
              -webkit-transition-timing-function:ease; transition-timing-function:ease;}
.basic013_morebtn:hover:before {-webkit-transform: scaleX(1); transform: scaleX(1);}


  @media (min-width:1300px) and (max-width:1400px){.copy .inner {padding:0 50px;}}
  @media (min-width:1300px){
    .mainVisual .swiper-container.mainSlider_001 {/* min-height:900px; */height: 500px;}

    .copy h3 {font-size: 60px;}
  }

  @media (min-width:991px) and (max-width:1299px){
    .mainVisual .swiper-container.mainSlider_001 {height: 500px;}

    .copy .inner {padding:0 15px;}
    .copy h3 {font-size: 60px;}
  }
  @media (min-width:800px) and (max-width:990px){
    .mainVisual .swiper-container.mainSlider_001 {height: 450px;/* min-height:600px; */}

    .copy .inner {padding:0 15px;}
    .copy h3 {font-size:45px;}
    .copy p.smallp {font-size:17px;}
    .basic013_morebtn {padding:15px 40px !important;}
  }



  @media (max-width:799px){
    .mainVisual .swiper-container.mainSlider_001 {height: 30vh;min-height: 280px;}

    .copy .inner {padding:0 10px;}
    .basic013_morebtn {padding: 11px 25px !important;font-size: 15px !important;}
  }
  @media (min-width:600px) and (max-width:799px){
    .copy h3 {font-size:28px;}
    .copy p.smallp {font-size:16px; padding-top:20px;}
  }
  @media (max-width:599px){
    .copy h3 {font-size:28px; color:#fff !important;}
    .copy p.smallp {font-size:15px; padding-top:20px; color:#fff !important;}
  }








.inner_layer {position:absolute; width:100%; z-index:0;}

  @media (min-width:1050px){
    .inner_layer {bottom:0;}
  }
  @media (max-width:1049px){
    .inner_layer {position:relative; float:left; background:rgba(0,0,0,0.5);}
  }

.contents > .inner {/* margin-top:-20px; *//* max-width:none; *//* position:relative; *//* padding-top:30px; */}
.contents > .inner:before {/* content:""; *//* width:100%; *//* height:20px; *//* background: url(/sample/template/basic/basic013/img/rotten-curve-1.png); *//* position: absolute; *//* top: 10px; */}




/* slide btn */
.mainVisual .swiper-container-horizontal .swiper-pagination-bullets {text-align:left; box-sizing:border-box;}
.mainVisual .swiper-pagination-clickable .swiper-pagination-bullet {opacity:1;margin-left:10px;width:12px;height:12px;background:#095296;border:1px solid rgba(255,255,255,0.4);border-radius:100%;}
.mainVisual .swiper-pagination-clickable .swiper-pagination-bullet:first-child {margin-left:0;}
.mainVisual .swiper-pagination-bullet-active {opacity:1 !important; background:#fff !important; border:1px solid rgba(0,0,0,0.5) !important;}
.mainVisual .swiper-pagination-clickable .swiper-pagination-bullet-active {background:#fff !important;}


/*main swiper*/
div.swiper-pagination-center{position:absolute;bottom:50px;left:0;z-index:10;width:100%;/* margin-left:-90px; */display:table;text-align:center;/* background:rgba(255, 255, 255, 0.5); *//* padding:5px 10px; *//* border-radius:10px; */}
div.swiper-pagination-center div.swiper-pagination {display:inline-block;text-align:center;position:relative;}


div.indicator {z-index:10;display:inline-block;margin-left:5px;display:none;}
div.indicator button{width:12px; height:12px;border:0;  outline:none; cursor:pointer; vertical-align:top;}
div.indicator button.play{background:url("/sample/template/basic/basic009/img/play.png")no-repeat; text-indent:-9999px;}
div.indicator button.stop{background:url("/sample/template/basic/basic009/img/stop.png")no-repeat; text-indent:-9999px;}

div.mainVisual .swiper-button-next, 
div.mainVisual .swiper-button-prev {margin-top:-45px !important; width:55px; height:55px; border-radius:100%; background:rgba(255,255,255,0.2);
                  background-size:15px; -webkit-transition:background-color 0.5s; transition:background-color 0.5s;}
div.mainVisual .swiper-button-next {background-image:none !important;right:45px;}
div.mainVisual .swiper-button-prev {background-image:none !important; opacity:1; left:45px;}
div.mainVisual .swiper-button-next:after,
div.mainVisual .swiper-button-prev:after {content:"\279C";content: "";width: 15px;height: 15px;display: inline-block;border: 3px solid #fff;border-width: 3px 3px 0 0;transform: rotate(45deg);position:absolute;top: 18px;left: 0;color:#fff;/* font-size:30px; */line-height:55px;}
div.mainVisual .swiper-button-prev:after {border-width:0 0 3px 3px; transform:rotate(180deg);}
div.mainVisual .swiper-button-next:after {left: -3px;-webkit-transition:font-size 0.5s, left 0.5s;transition:font-size 0.5s, left 0.5s;}
div.mainVisual .swiper-button-prev:after {transform: rotate(45deg);left: 42px;-webkit-transition: font-size 0.5s, left 0.5s;transition: font-size 0.5s, left 0.5s;}

div.mainVisual .swiper-button-next:hover, 
div.mainVisual .swiper-button-prev:hover {background-color: #21384d;}
div.mainVisual .swiper-button-next:hover:after,
div.mainVisual .swiper-button-next.swiper-button-disabled:after {left: 16px;}
div.mainVisual .swiper-button-prev:hover:after {left: 23px;}
div.mainVisual .swiper-button-prev.swiper-button-disabled:after {left: 23px; opacity:0.4;}

  @media (max-width:1299px){
    div.mainVisual .swiper-button-next, 
    div.mainVisual .swiper-button-prev {display:none;}
  }
  
  @media (max-width:799px){ 
    div.swiper-pagination-center {bottom: 40px;}
  }





@media (max-width:799px){ 

	.layout_02 .ect001.mpadding {padding:0 15px; box-sizing:border-box;}
}

  @media (max-width:599px){ 
    .mobile_4trans2.layout_block4.layout_padding > .layout_04 {width:49.5% !important;}
    .mobile_4trans2.layout_block4.layout_padding > .layout_04 {margin-right:0 !important;}
    .mobile_4trans2.layout_block4.layout_padding > .layout_04:nth-child(2n+1) {margin-right:1% !important; margin-bottom:6px !important;}
  }