@charset "UTF-8";
@media screen and (min-width:768px) and ( max-width:1365px){

    .pc1{ display: none !important; }
    .pc2{ display: block !important; }

main{
}
.sec01{
    background-color: #000;
    position: sticky;
    top: 0;
}
.sec01::before{
    content: "";
    position: absolute;
    width: 2.93vw;
    height: 100%;
    background-color: #cc0000;
}
.sec01_con{
    width: 100vw;
    display: flex;
    margin: 0 auto;
    position: relative;
}
.main_copy{
    width: 41.026vw;
    position: relative;
    color: #FFF;
    padding-left: 11.722vw;
}

.main_copy ul{
    position: absolute;
    top: ;
    font-size: 1.026vw;
    margin-top: 1.465vw;
}
.main_title{
    position: absolute;
    top: 25.641vw;
    left: 5.861vw;
    width: 36.63vw;
    z-index: 1;
    text-shadow: 2px 2px 20px rgba(0, 0, 0, 0.3);
}
.main_title p{
    font-size: 1.758vw;
    margin-bottom: 1.832vw;
}
.main_title .en{
    font-size: 5.421vw;
    line-height: 1.2;
    margin-bottom: 1.832vw;
    text-shadow: 2px 2px 15px rgba(0, 0, 0, 0.5);
}
.main_img{
    width: 58.608vw;
    width: calc(58.608vw + (100vw - 41.026vw) / 2);
    height: 69.231vw;
    margin-left: auto; /* 右寄せ */
}
.main_img .slick-track{
    width: calc(58.608vw + (100vw - 41.026vw) / 2);
    height: 69.231vw;
}

.slider3 .slick-track img {
    width: calc(800px + (100vw - 1300px) / 2)!important;
    height: 69.231vw;
    object-fit: cover;
    object-position: left top;
  }

  .slider3 .slick-dots li{
    margin-right: 5.128vw;
  }
  .slider3 .slick-dots{
    position: absolute;
    display: flex;
    justify-content: normal !important;
    bottom: 2.93vw;
    left: 13.187vw;
    right: 0;
    font-size: 0;
    margin: auto;
    text-align: center;
    display: block;
  }



  @media screen and (min-width:768px) and ( max-width:1365px){
    .main_img{
        width: 60vw!important;
        height: 70vw!important;
    }
    .slider3 .slick-dots{
        left: 0;
    }
    .main_img .slick-track{
        width: 60vw!important;
        height: 70vw!important;
    }
    .slider3 .slick-track img {
        width: 60vw!important;
        height: 70vw!important;
    }
    }


.sec02{
    position: relative;
    width: 100%;
    margin: 0 auto;
}
.sec02_con{
    position: absolute;
    display: flex;
    justify-content: space-between;
    width: 92.308vw;
    top: 7.326vw;
    right: 0;
    left: 0;
    margin: auto;
}
.sec02 h2{
    width: 28vw;
    height: fit-content;
    font-size: 3.223vw;
    border-bottom: solid 1px #000;
    text-align: right;
    z-index: 1;
}
.sec02 p{
    width: 58vw;
    font-size: 1.4vw;
    z-index: 1;
    line-height: 1.6;
    white-space: nowrap;
}
.sec02_copy{
    width: auto;
    border: solid 1px #000;
    padding: 1.2vw;
    z-index: 1;
    margin: 2vw 0;
}
.sec02_copy p{
    padding-left: 1.465vw;
    font-size: 1.2vw !important;
    line-height: 1.4 !important;
    width: 51vw;
    white-space: nowrap;
}
.sec02_copytytle{
    padding-left: 0!important;
}
.sec02_copy_{
    padding-left: 0!important;
    font-size: 16px !important;
    line-height: 1.5 !important;
    width: 0!important;
    white-space: normal;
    margin-right: 0.366vw;
}
.sec02_copy div{
    display: flex;
}
.sec02_con_img{
    width: 29.304vw;
    display: block;
    margin-left: auto;
    margin-right: 0;
}
.co2 sup {
    font-size: 0.7em;
    vertical-align: -0.5em;
}

.sec03{
    position: relative;
    width: 100%;
    height: 54.5vw;
    background: linear-gradient(135deg, #b08b66, #b48f68, #e4c37d);
}
.sec03::before{
    content: "";
    position: absolute;
    width: 100%;
    height: 2.93vw;
    background-color: #cc0000;
}
.sec03_con{
    width: 100vw;
    display: flex;
    margin: 0 auto;
}
.sec03_copy{
    position: relative;
    width: 66.667vw;
    padding: 10vw 0 0 12.454vw;
    color: #FFF;
}
.sec03_copy h2{
    position: absolute;
    font-size:  12vw;
    top: -11vw;
}
.sec03_copy h3{
    font-size: 1.612vw;
    margin-bottom: 3.663vw;
}
.sec03_copy p{
    font-size: 1.465vw;
    line-height: 1.8;
}
.sec03_img{
    width: 32.967vw;
    z-index: 1;
}
.sec03_img img{
    width: 100%;
    height: auto;
    object-fit: cover;
}

.sec04 {
    width: 100%;
    position: relative;
    top: 0;
    background: #000;
}
.sec04::before {
    content: "";
    position: absolute;
    width: 2.93vw;
    height: 100%;
    background-color: #cc0000;
}
.sec04_con {
    position: relative;
    width: 100vw;
    margin: 0 auto;
    padding: 8.791vw 13.553vw 27.106vw;
    color: #FFF;
}
.sec04_con h2 {
    font-size:  12vw;
    line-height: 0.5;
    margin-bottom: 2.198vw;
}
.sec04_con h2 span {
    font-size: 4.762vw;
}
.sec04_con h3 {
    font-size: 1.612vw;
    margin-bottom: 6.593vw;
}
.sec04_con p {
    width: 30vw;
    font-size: 1.319vw;
    line-height: 1.8;
}
.sec04_con img {
    position: absolute;
    width: 43.223vw;
    top: 21.978vw;
    right: 0;
}

.sec05{
    width: 100%;
    position: relative;
    background: linear-gradient(135deg, #b08b66, #b48f68, #e4c37d);
}
.sec05::before{
    position: absolute;
    content: "";
    position: absolute;
    width: 2.93vw;
    height: 100%;
    right: 0;
    background-color: #cc0000;
}
.sec05_con{
    width: 100vw;
    margin: 0 auto;
}
.sec05_img{
    width: 100%;
    position: relative;
    z-index: 1;
}
.sec05_con{
    position: relative;
}
.sec05_con ul{
    width: 53.846vw;
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 9.524vw;
}
.sec05_con ul li{
    width: 53.846vw;
    height: auto;
}
.sec05_con ul li img{
    width: 53.846vw;
    height: auto;
    margin-bottom: 7.326vw;
}
.sec05_copy{
    position: absolute;
    top: 3.663vw;
    right: 11.722vw;
    color: #FFF;
    text-align: right;
}
.sec05_copy h2{
    font-size: 10vw;
    line-height: 1;
    margin-bottom: 0;
}
.sec05_copy h3{
    font-size: 1.6vw;
    line-height: 1;
    margin-bottom: 7.326vw;
}
.sec05_copy p{
    width: 45vw;
    font-size: 1.4vw;
    text-align: left;
}

.sec06 {
    width: 100%;
    position: relative;
    top: 0;
    background: #000;
}
.sec06_con {
    position: relative;
    width: 73.26vw;
    margin: 0 auto;
    padding: 7.326vw 0 13.553vw;
    color: #FFF;
}
.sec06_img01{
    width: 100%;
    margin-bottom: 5.861vw;
}
.sec06_img02{
    width: 100%;
}
.sec06_con h2 {
    font-size: 8vw;
    line-height: 0.7;
    margin-bottom: 1.465vw;
    margin-left: 2.93vw;
}
.sec06_con h2::before {
    content: "";
    position: absolute;
    width: 1.465vw;
    height: 5.861vw;
    top: 7.326vw;
    left: 0;
    background-color: #cc0000;
}
.sec06_con h3 {
    font-size: 1.612vw;
    margin-bottom: 4.396vw;
    margin-left: 2.93vw;
}
.sec06_con2 {
    display: flex;
    justify-content: space-between;
    margin-bottom: 3.663vw;
}
.sec06_copy {
    width: 100%;
    font-size: 1.319vw;
    margin-bottom: 5.128vw;
    line-height: 1.8;
}
.sec06_copytitle {
    font-size: 2.637vw;
    margin-bottom: 1.465vw;
    line-height: 1;
}
.sec06_annotation {
    font-size: 1.172vw;
}
.sec06_annotation .indent {
    display: inline-block;
    text-indent: 1.978vw;
}
.sec07 {
    width: 100%;
    position: relative;
    top: 0;
    background: linear-gradient(135deg, #b08b66, #b48f68, #e4c37d);
}

.sec07::before {
    content: "";
    position: absolute;
    width: 2.93vw;
    height: 100%;
    background-color: #cc0000;
}

.sec07_con {
    position: relative;
    width: 73.26vw;
    margin: 0 auto;
    padding: 7.326vw 0 13.553vw;
    color: #FFF;
}

.sec07_img01 {
    position: absolute;
    width: 16.85vw;
    top: 25.641vw;
    right: 0;
}

.sec07_img02 {
    margin-bottom: 6.593vw;
}

.sec07_con h2 {
    font-size: 8vw;
    line-height: 0.7;
    margin-bottom: 1.465vw;
}

.sec07_con h3 {
    font-size: 1.612vw;
    margin-bottom: 8.791vw;
}

.sec07_con2 {
    display: flex;
    justify-content: space-between;
    margin-bottom: 3.663vw;
}

.sec07_copy {
    width: 100%;
    font-size: 1.319vw;
    line-height: 1.8;
    margin-bottom: 8.059vw;
}

.sec07_copytitle {
    font-size: 2.93vw;
    margin-bottom: 3.663vw;
    line-height: 1;
}

.sec07_annotation {
    font-size: 1.172vw;
}

.sec07_annotation .indent {
    display: inline-block;
    text-indent: 1.978vw;
}
.sec08 {
    width: 100%;
    position: relative;
    background-color: #000;
    color: #FFF;
    padding: 11vw 0px;
}
.sec08_img {
    width: 750px!important;
}
.sec08_con {
    display: flex;
    justify-content: space-between;
    width: 100vw;
    margin: 0 auto 50px;
}
.sec08_con img {
    width: 40%;
    height: 100%;
}
.sec08_copy {
    margin-right: 11vw;
}
.sec08_copy h2 {
    font-size: 8.791vw;
    line-height: 1;
    margin-bottom: 2.198vw;
    margin-right: 6.593vw;
    text-align: right;
}
.sec08_copy h2::before {
    position: absolute;
    content: "";
    width: 1.465vw;
    top: 0.806vw;
    height: 6.593vw;
    right: -3.663vw;
    background-color: #cc0000;
    z-index: 2;
}
.sec08_copy h3 {
    font-size: 1.612vw;
    line-height: 1;
    text-align: right;
    margin-bottom: 4.396vw;
    margin-right: 6.593vw;
}
.sec08_copy p {
    width: 36.63vw;
    font-size: 1.319vw;
    text-align: left;
    line-height: 1.8;
    margin-left: 7.326vw;
}
.sec08 ul {
    display: flex;
    width: 100vw;
    margin: 0 auto;
}
.sec08 ul li {
    width: 32.234vw;
}

.sec09 {
    position: relative;
    width: 100%;
    background-color: #9d876e;
}
.sec09_con {
    width: 100vw;
    margin: 0 auto;
    padding: 11vw 13.187vw 14.652vw;
    color: #FFF;
}
.sec09 h2 {
    font-size: 2.637vw;
    text-align: center;
    margin-bottom: 3.663vw;
}
.sec09 h3 {
    font-size: 1.319vw;
    width: 30.403vw;
    padding-left: 3.663vw;
}
.sec09 p {
    font-size: 1.319vw;
    width: 42.857vw;
}
.sec09 ul {
    border-top: solid 1px #fff;
    border-bottom: solid 1px #fff;
    margin-bottom: 11vw;
}
.sec09 ul li {
    display: flex;
    align-items: center;
    font-size: 1.319vw;
    padding: 2.198vw 0;
    border-bottom: solid 1px #fff;
}
.sec09 ul li:last-child {
    border-bottom: 0;
}
.sec09 ul li div p {
    border-bottom: solid 1px #fff;
    padding: 2.198vw 0;
}
.sec09 ul li div p:first-child {
    padding: 0 0 2.198vw;
}
.sec09 ul li div p:last-child {
    padding: 2.198vw 0 0;
    border-bottom: 0;
}
.sec09 ul li div p span {
    font-weight: bold;
}
.sec09_map {
    position: relative;
    width: 73.26vw;
    height: auto;
}
.sec09_map img {
    width: 75%;
    margin: 0 auto;
    display: block;
}
iframe{
    width: 100%;
    height: 100%;
    border: 0;
    filter: grayscale(100%) sepia(30%);
    display: block;
    margin-bottom: 2.198vw;
}
/*==================================================
スライダーのためのcss
===================================*/
.slider {
    width: 58.608vw;
    margin: 0 auto;
}
 .slider img {
    width: 28.718vw;
     height:auto;
 }
.slider p{
    width: 25.641vw; 
    font-size: 1.172vw;
    padding-top: 1.099vw;
    margin: 0 auto;
}
 /*slickのJSで書かれるタグ内、スライド左右の余白調整*/
 .slider .slick-slide {
    margin: 0 auto; /* スライドを中央揃え */
    width: 100%; /* スライド幅を調整 */
    height: auto; /* 高さを自動調整 */
}
 /*矢印の設定*/
 /*戻る、次へ矢印の位置*/
 .slick-prev, 
 .slick-next {
     position: absolute;/*絶対配置にする*/
     top: 35%;
     cursor: pointer;/*マウスカーソルを指マークに*/
     outline: none;/*クリックをしたら出てくる枠線を消す*/
     border-top: 0px solid #666;/*矢印の色*/
     border-right: 0px solid #666;/*矢印の色*/
     height: 1.099vw;
     width: 1.099vw;
 }
 .slick-prev {/*戻る矢印の位置と形状*/
    /* background-image: url("../images/article_img/slick-prev.png"); */
    background-size: cover;
    top: -5.128vw;
    right: 6.593vw;
     width: 2.93vw;
     height: 2.93vw;
    transition: 0.5s;

 }
.slick-prev:hover {
    transition: 0.5s;
}
 .slick-next {/*次へ矢印の位置と形状*/
    /* background-image: url("../images/article_img/slick-next.png"); */
    background-size: cover;
    top: -5.128vw;
    right: 2.198vw;
     width: 2.93vw;
     height: 2.93vw;
        transition: 0.5s;
 }
.slick-next:hover {
    transition: 0.5s;
}
.slick-slider{
    position: relative;
}
 /*ドットナビゲーションの設定*/
 .slick-dots {
    position: absolute;
    display: none;
    text-align: center;
    margin: 0;
    z-index: 5;
}
.slick-dots li {
    display: none;
    display:inline-block;
    margin:0 0.733vw;
    cursor: pointer;
}
.slick-dots button {
    display: none!important;
    color: transparent;
    outline: none;
    width:0.733vw;/*ドットボタンのサイズ*/
    height:0.879vw;/*ドットボタンのサイズ*/
    display:block;
    border-radius:50%;
    background:#000c17;/*ドットボタンの色*/
    border: none;
}
.slick-dots .slick-active button{
    display: none;
    background:#20374A;/*ドットボタンの現在地表示の色*/
}
.slick-track{
    display: flex!important;
}
/* スライダー */
button {
    all: unset;
    display: inline-block;
    cursor: default;
  }
  .slick-prev,.slick-next{
  display: none;
  position: absolute;
  z-index: 10;
  font-size: 0;
  }
  .slick-next{
    top: 50%;
    right: 13vw;
  }
  .slick-prev{
    top: 50%;
    left: 13vw;
  }
  .slick-prev::before {
    content: "";
    display: block;
    width: 3.663vw;
    height: 7.326vw;
    background-image: url('../images/arrow_left.png');
    background-size: contain;
    background-repeat: no-repeat;
  }
  .slick-next::before {
    content: "";
    display: block;
    width: 3.663vw;
    height: 7.326vw;
    background-image: url('../images/arrow_right.png');
    background-size: contain;
    background-repeat: no-repeat;
  }
  .slick-dots{
    position: absolute;
    display: flex;
    justify-content: normal !important;
    bottom: 2.93vw;
    left: 30%;
    right: 50%;
    font-size: 0;
  }
  .slick-dots li{
  margin-right: 4.396vw;
  }
  .slick-dots li::before{
    content: "";
    display: block;
    width: 0.366vw;
    height: 0.366vw;
    background-image: url('../images/dots.jpg');
    background-size: contain;
    background-repeat: no-repeat;
  }
  .slick-dots li::before{
    content: "";
    display: block;
    width: 4.762vw;
    height: 0.366vw;
    background-image: url('../images/dots.jpg');
    background-size: contain;
    background-repeat: no-repeat;
  }
  .slick-dots .slick-active::before{
  content: "";
    display: block;
    width: 4.762vw;
    height: 0.366vw;
    background-image: url('../images/dots_active.jpg');
    background-size: contain;
    background-repeat: no-repeat;
  }
  .slick-disabled{
  display: none!important;
  }
.block_con1, .block_con2 {
    position: relative; /* デフォルトは relative */
    width: 100%;
}
.block_con3 {
    position: relative
}
.slick-dotted.slick-slider{
    margin-bottom: 0;
}
/* フェードイン */
.fade {
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 2s, transform 1s
  }
  .fade.active {
    opacity: 1;
    transform: translateY(0)
  }
  /* フェードイン */
.fadeen {
    opacity: 0;
    transform: translateY(45px);
    transition: opacity 3.5s, transform 1.8s
  }
.fadeen.active {
opacity: 1;
transform: translateY(0)
}


}