@charset "UTF-8";
/* CSS Document */
 
.cf:before,
.cf:after {
    content: " ";
    display: table;
}

.cf:after {
    clear: both;
}

.cf {
    *zoom: 1;
}

.cb {clear:both !important;}

.fl {float:left !important;}
.fr {float:right !important;}

figure {
    display: block;
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
}

.m-plus-rounded-1c-medium {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.m-plus-rounded-1c-extrabold {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 800;
  font-style: normal;
}

.collection .secCollection {
    margin: 0 !important;
    padding: 0 !important;
}

#header .logo {position: fixed;}

.img_main{
    margin: 0 auto;
    padding: 4% 5%;
    width: 1300px;
    max-width: 90%;
}

.img_main img {
    width: 100%;
}


h2 {
    max-width: 412px;
    width: 30%;
    position:absolute;
    top:35%;
    left: 37%;
}

h2 img {width: 100%;}

.txt_01 {
    max-width: 266px;
    width: 20%;
    margin: 4% auto 0;
}

.container {
    width: 100%;
    margin: 0;
}

.con {
    background: #fff;
    max-width: 1060px;
    width: 100%;
    padding: 100px 0;
    margin: 0 auto;
    position: relative;
}

.mov1 {
    width: 83%;
    margin: 5% 8.5% 0;
}

ul.item_01, ul.item_02, ul.item_03, ul.item_04, ul.item_05, ul.item_06, ul.item_07, ul.item_08, ul.item_09, ul.item_10, ul.item_11 {
    clear: both;
    display: block;
    position: relative;
}
ul.item_01 li, ul.item_02 li, ul.item_03 li, ul.item_04 li, ul.item_05 li, ul.item_06 li, ul.item_07 li, ul.item_08 li, ul.item_09 li, ul.item_10 li, ul.item_11 li {
    float: left;
    position: relative;
}
ul.item_01 li img,ul.item_02 li img,ul.item_03 li img,ul.item_04 li img,ul.item_05 li img,ul.item_06 li img,ul.item_07 li img,ul.item_08 li img,ul.item_09 li img,ul.item_10 li img,ul.item_11 li img {
    width: 100%;
}
ul.item_01 li.n1 {
    width: 49.6%;
    margin: 0 0 0 25.2%;
    z-index: 10;
}

ul.item_01 li.n2 {
    width: 14.3%;
    margin: 9.4% 0 0 -12.4%;
    z-index: 20;
}

ul.item_01 li.n3 {
    clear: both;
    width: 25.5%;
    margin: 5.3% 0 0 26%;
    z-index: 20;
}

ul.item_01 li.n4 {
    width: 27.8%;
    margin: 7.5% 0 0 -1.6%;
}

ul.item_01 li.n5 {
    clear: both;
    width: 21.9%;
    margin: -26% 0 0 21%;
}

ul.item_01 li.n6 {
    width: 19.8%;
    margin: 8.3% 0 0 3.5%;
}

ul.item_01 li.n7 {
    width: 53.4%;
    margin: 7.5% 0 0 23.3%;
    clear: both;
}






ul.item_02 li.n1 {
    width: 14.3%;
    margin: 45% 0 0 36.1%;
    z-index: 20;
}

ul.item_02 li.n2 {
    width: 49.6%;
    margin: 0% 0 0 -8.5%;
    z-index: 10;
}

ul.item_02 li.n3 {
    width: 49.6%;
    margin: 9.25% 0 0 25.28%;
    clear: both;
}

ul.item_02 li.n4 {
    width: 21.6%;
    margin: 11.5% 0 0 -11.6%;
}

ul.item_02 li.n5 {
    width: 30.5%;
    margin: 7.3% 0 0 20.2%;
    clear:both;
}

ul.item_02 li.n6 {
    width: 23%;
    margin: 21% 0 0 -2%;
}

ul.item_02 li.n7 {
    width: 12.4%;
    margin: 9.6% 0 0 25.7%;
    clear: both;
}

ul.item_02 li.n8 {
    width: 12.4%;
    margin: 18.3% 0 0 -3.6%;
}

ul.item_02 li.n9 {
    width: 30.4%;
    margin: -14.8% 0 0 2.2%;
}



ul.item_03 li.n1 {
    width: 49.6%;
    margin: 0 0 0 9.4%;
}

ul.item_03 li.n2 {
    width: 15%;
    margin: 8% 0 0 -9.4%;
}

ul.item_03 li.n3 {
    width: 27.8%;
    margin: 7.3% 0 0 21%;
    clear: both;
}

ul.item_03 li.n4 {
    width: 22.4%;
    margin: 8.9% 0 0 3.3%;
}

ul.item_03 li.n5 {
    width: 28%;
    margin: 4.3% 0 0 24%;
    clear: both;
    z-index: 20;
}

ul.item_03 li.n6 {
    width: 27.8%;
    margin: -20% 0 0 -2.3%;
    z-index: 10;
}

ul.item_03 li.n7 {
    width: 53.4%;
    margin: 7.5% 0 0 36%;
    clear: both;
}


ul.item_04 li.n1 {
    width: 14.3%;
    margin: 15% 0 0 22%;
    z-index: 20;
    clear: both;
}

ul.item_04 li.n2 {
    width: 49.6%;
    margin: 0% 0 0 -12%;
    z-index: 10;
}

ul.item_04 li.n3 {
    width: 27.3%;
    margin: 9.4% 0 0 18.9%;
    clear: both;
}

ul.item_04 li.n4 {
    width: 31.1%;
    margin: 7.6% 0 0 -4.4%;
}

ul.item_04 li.n5 {
    width: 27.3%;
    margin: -16% 0 0 52.6%;
    clear: both;
}

ul.item_04 li.n6 {
    width: 26.1%;
    margin: -9.7% 0 0 26.2%;
    clear: both;
}

ul.item_04 li.n7 {
    width: 20%;
    margin: 12.7% 0 0 1%;
}

ul.item_04 li.n8 {
    width: 53.4%;
    margin: 7.2% 0 0 23.2%;
    clear: both;
}




ul.item_05 li.n1 {
    width: 49.6%;
    margin:0% 0 0 25.2%;
    clear: both;
    z-index: 10;
}

ul.item_05 li.n2 {
    width: 14.3%;
    margin:-14.6% 0% 0 26.7%;
    clear: both;
    z-index: 20;
}

ul.item_05 li.n3 {
    width: 23%;
    margin: -65% 0 0 60%;
    clear: both;
    z-index: 20;
}

ul.item_05 li.n4 {
    width: 17.3%;
    margin: 11.4% 0 0 24.7%;
    z-index: 20;
}

ul.item_05 li.n5 {
    width: 28.5%;
    margin: 8.7% 0 0 -6.5%;
    z-index: 10;
}

ul.item_05 li.n6 {
    width: 28.5%;
    margin: 0% 0 0 35.5%;
    clear: both;
}

ul.item_05 li.n7 {
    width: 18.5%;
    margin: 9.4% 0 0 -4.2%;
}

ul.item_05 li.n8 {
    width: 53.4%;
    margin: 7.2% 0 0 23.3%;
    clear: both;
}

ul.item_06 li.n1 {
    width: 100%;
    margin: 0 0 0 0;
    clear: both;
}

ul.item_06 li.n2 {
    width: 35.8%;
    margin: 16.5% 0 0 -41.6%;
}

.checkallitem {
    margin: 5% auto;
    max-width: 550px;
    width: 50%;
}


.clearfix::after {
   content: "";
   display: block;
   clear: both;
}

.conA {
    background: #DF370A;
    /*width: 100%;
    margin: 0 auto;*/
    padding: 5% 0;
    position: relative;
    width: 100vw;
    margin: 0 calc(50% - 50vw);
}

.bg_pi {
    background: #FFA0AA !important;
}

.bg_Ora {
    background: #FFAA61 !important;
}

.cPi {
    color: #FFA0AA !important;
}

.cOr {
   color: #FFAA61 !important; 
}

video {width: 100%;}

.cs {
    font-size: 85%;
    background: tranceparent;
}
/*========= スクロールダウンのためのCSS ===============*/

/*====== 9-1-1 縦線が動いてスクロールを促す =======*/

/*スクロールダウン全体の場所*/
.scrolldown1{
    /*描画位置※位置は適宜調整してください*/
	position:absolute;
	left:50%;
	bottom:10px;
    /*全体の高さ*/
	height:50px;
}

/*Scrollテキストの描写*/
.scrolldown1 span{
    /*描画位置*/
	position: absolute;
	left:-15px;
	top: -15px;
    /*テキストの形状*/
	color: #333;
	font-size: 0.8rem;
	letter-spacing: 0.05em;
}

/* 線の描写 */
.scrolldown1::after{
	content: "";
    /*描画位置*/
	position: absolute;
	top: 0;
    /*線の形状*/
	width: 1px;
	height: 50px;
	background: #666;
    /*線の動き1.4秒かけて動く。永遠にループ*/
	animation: pathmove 1.4s ease-in-out infinite;
	opacity:0;
}

/*高さ・位置・透過が変化して線が上から下に動く*/
@keyframes pathmove{
	0%{
		height:0;
		top:0;
		opacity: 0;
	}
	30%{
		height:30px;
		opacity: 1;
	}
	100%{
		height:0;
		top:50px;
		opacity: 0;
	}
}

#head1{
	width:100%;
    /*height: 950px;
	height: 100vh;*/
	position: relative;
    background: url("../img/bg.png") no-repeat;
    background-size: cover;
}

/*#head1_in {
    position:fixed;
	top:90px;
	left:0;
	width:100%;
    height: 100vh;
}

#head1:before{
	content: '';
	position:fixed;
	top:120px;
	left:0;
	width:1300px;
	height: 100vh;
}*/

#container{
	position: relative;
	z-index:1;
	background:#fff;
	padding:0;
	text-align: center;
}

/*===========
inview
===========*/

.fadeIn {
  opacity: 0;
  transition: 2s;
}
.fadeIn.is-show {
  opacity: 1;
}

.fadeUp {
  opacity: 0;
  transform: translate(0, 50%);
  transition: 2s;
}
.fadeUp.is-show {
  transform: translate(0, 0);
  opacity: 1;
}

.fadeIn_right {
  opacity: 0;
  transform: translate(50%, 0);
  transition: 2s;
}
.fadeIn_right.is-show {
  transform: translate(0, 0);
  opacity: 1;
}

.fadeIn_left {
  opacity: 0;
  transform: translate(-50%, 0);
  transition: 2s;
}
.fadeIn_left.is-show {
  transform: translate(0, 0);
  opacity: 1;
}

.keyvisual__scroll--circle{
  height: auto;
  width: 100%;
  animation: rotate 15s linear infinite;
}

@keyframes rotate {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}

.inner2{
  width:80%;
  max-width: 526px;
  margin: 0 auto;
}

.inner2 p {color: #fff; text-align: center;}
.inner2 table {width: 100%; color: #fff; margin-top: 50px;}
.inner2 table th,.inner2 table td {padding:0 2% 3% 0;}
.inner2 table .btn,.inner2 table .cs {
    background: tranceparent;
    border-radius: 20px;
    padding: 3px 0;
    color: #DF370A;
    display: block !important;
    text-align: center;
    width: 100px;
    border: 1px solid #fff;
    background: #fff;
}

.slide>span{
  display: flex;
  align-items: center;
  justify-content: center;
 /* height: 680px;*/
  background:transparent;
}

.slide>span img {
    width: 100%;
}

/* arrow */
.slick-arrow{
  z-index: 2;
  top: 50%;
  margin-top: -10px;
  width: 51px;
  height: 51px;
  /*border-top: 3px solid #3498db;
  border-right: 3px solid #3498db;*/
  opacity: .8;
}
.slick-arrow::before{
  content: '';
}
.slick-prev{
  left: -60px;
  background: url("../img/btn_back.svg") no-repeat;
}
.slick-next{
  right: -60px;
  background: url("../img/btn_next.svg") no-repeat;
}

.slick-prev:hover,.slick-prev:focus{
     opacity: 1;
     background: url("../img/btn_back.svg") no-repeat;
}

.slick-next:hover,.slick-next:focus{
     opacity: 1;
     background: url("../img/btn_next.svg") no-repeat;
}
/* dots */
.slick-dots{
  bottom: 5%;
  right: -38%;
}
.slick-dots li,
.slick-dots li button,
.slick-dots li button::before{
  width: 12px;
  height: 12px;
}
.slick-dots li{
  margin: 0 7px;
}
.slick-dots li button{
  background-color: #ff9966;
  /*background-color: #82aae8;*/
  opacity: 1;
  border-radius: 100%;
}
.slick-dots li.slick-active button{
    background-color: #333333;
  opacity: 1;
}
.slick-dots li button::before{
  content: '';
}


/*==================================================
スライダーのためのcss
===================================*/
.slider img {
    width:100%;/*スライダー内の画像を横幅100%に*/
    height:auto;
}

/*slickのJSで書かれるタグ内、スライド左右の余白調整*/

.slider .slick-slide {
    margin:0 10px;/*スライド左右の余白調整*/
}

.aaa {
overflow: hidden;
}

/*========= 流れるテキスト ===============*/

/*全共通*/

.slide-in {
	overflow: hidden;
    display: inline-block;
}

.slide-in_inner {
	display: inline-block;

}

/*左右のアニメーション*/
.leftAnime{
    opacity: 0;/*事前に透過0にして消しておく*/
}

.slideAnimeLeftRight {
	animation-name:slideTextX100;
	animation-duration:0.8s;
	animation-fill-mode:forwards;
    opacity: 0;
}

@keyframes slideTextX100 {
  from {
	transform: translateX(-100%); /*要素を左の枠外に移動*/
        opacity: 0;
  }

  to {
	transform: translateX(0);/*要素を元の位置に移動*/
    opacity: 1;
  }
}

.slideAnimeRightLeft {
	animation-name:slideTextX-100;
	animation-duration:0.8s;
	animation-fill-mode:forwards;
    opacity: 0;
}


@keyframes slideTextX-100 {
  from {
	transform: translateX(100%);/*要素を右の枠外に移動*/
    opacity: 0;
  }

  to {
	transform: translateX(0);/*要素を元の位置に移動*/
    opacity: 1;
  }
}

footer #pagetop {
    margin-top: -70px;
    position: absolute;
    }

@media screen and (min-width: 768px) {

.pc {display: block;}
.sp {display: none;}

}

@media screen and (max-width: 767px){

.pc {display: none; }
.sp {display: block;}

.img_main{
    margin: 0 auto;
    padding: 4% 6%;
    width: 660px;
    max-width: 88%;
}

.img_main img {
    width: 100%;
}

h2 {
    max-width: 426px;
    width: 50%;
    position:absolute;
    top:35%;
    left: 25%;
}

h2 img {width: 100%;}

.txt_01 {
    max-width: 460px;
    width: 40%;
    margin: 4% auto 0;
}

.con {
    background: #fff;
    max-width: 767px;
    width: 100%;
    padding: 4% 0;
    margin: 0 auto;
    position: relative;
}

.box_mov {
    width: 100%;
    margin: 4% 0;
}

ul.item_01, ul.item_02, ul.item_03, ul.item_04, ul.item_05, ul.item_06, ul.item_07, ul.item_08, ul.item_09, ul.item_10, ul.item_11 {
    clear: both;
    display: block;
    position: relative;
}
ul.item_01 li, ul.item_02 li, ul.item_03 li, ul.item_04 li, ul.item_05 li, ul.item_06 li, ul.item_07 li, ul.item_08 li, ul.item_09 li, ul.item_10 li, ul.item_11 li {
    float: left;
    position: relative;
}
ul.item_01 li img,ul.item_02 li img,ul.item_03 li img,ul.item_04 li img,ul.item_05 li img,ul.item_06 li img,ul.item_07 li img,ul.item_08 li img,ul.item_09 li img,ul.item_10 li img,ul.item_11 li img {
    width: 100%;
}
ul.item_01 li.n1 {
    width: 86%;
    margin: 0 0 0 7%;
    z-index: 10;
}

ul.item_01 li.n2 {
    width: 25%;
    margin: 15% 0 0 -22%;
    z-index: 20;
}

ul.item_01 li.n3 {
    clear: both;
    width: 44%;
    margin: 10.5% 0 0 8%;
    z-index: 20;
}

ul.item_01 li.n4 {
    width: 50%;
    margin: 7.5% 0 0 -2%;
}

ul.item_01 li.n5 {
    clear: both;
    width: 38%;
    margin: -45% 0 0 7.7%;
}

ul.item_01 li.n6 {
    width: 34%;
    margin: 15% 0 0 7%;
}

ul.item_01 li.n7 {
    width: 92%;
    margin: 10% 0 0 4%;
    clear: both;
}






ul.item_02 li.n1 {
    width: 25%;
    margin: 82% 0 0 3%;
    z-index: 20;
}

ul.item_02 li.n2 {
    width: 86%;
    margin: 0 0 0 -14%;
    z-index: 10;
}

ul.item_02 li.n3 {
    width: 86%;
    margin: 10% 0 0 0%;
    clear: both;
}

ul.item_02 li.n4 {
    width: 38%;
    margin: 22% 0 0 -27%;
}

ul.item_02 li.n5 {
    width: 53%;
    margin: 8.9% 0 0 5.3%;
    clear:both;
}

ul.item_02 li.n6 {
    width: 40%;
    margin: 33% 0 0 -3%;
}

ul.item_02 li.n7 {
    width: 22%;
    margin: 16.5% 0 0 6%;
    clear: both;
}

ul.item_02 li.n8 {
    width: 22%;
    margin: 31% 0 0 -7%;
}

ul.item_02 li.n9 {
    width: 53%;
    margin: -25% 0 0 3%;
}



ul.item_03 li.n1 {
    width: 86%;
    margin: 0% 0 0 0%;
}

ul.item_03 li.n2 {
    width: 25%;
    margin: 15% 0 0 -14%;
}

ul.item_03 li.n3 {
    width: 48%;
    margin: 10.6% 0 0 0%;
    clear: both;
}

ul.item_03 li.n4 {
    width: 39%;
    margin: 13.5% 0 0 5.8%;
}

ul.item_03 li.n5 {
    width: 49%;
    margin: 7.2% 0 0 6%;
    clear: both;
    z-index: 20;
}

ul.item_03 li.n6 {
    width: 48%;
    margin: -35% 0 0 -3%;
    z-index: 10;
}

ul.item_03 li.n7 {
    width: 92%;
    margin: 10% 0 0 4%;
    clear: both;
}


ul.item_04 li.n1 {
    width: 25%;
    margin: 27% 0 0 2%;
    z-index: 20;
    clear: both;
}

ul.item_04 li.n2 {
    width: 86%;
    margin: 0% 0 0 -20%;
    z-index: 10;
}

ul.item_04 li.n3 {
    width: 48%;
    margin: 11% 0 0 0%;
    clear: both;
}

ul.item_04 li.n4 {
    width: 54.4%;
    margin: 8.5% 0 0 -9%;
}

ul.item_04 li.n5 {
    width: 48%;
    margin: -28.8% 0 0 52%;
    clear: both;
}

ul.item_04 li.n6 {
    width: 45.6%;
    margin: -17% 0 0 8.9%;
    clear: both;
}

ul.item_04 li.n7 {
    width: 34%;
    margin: 21% 0 0 4%;
}

ul.item_04 li.n8 {
    width: 92%;
    margin: 10% 0 0 4%;
    clear: both;
}




ul.item_05 li.n1 {
    width: 86%;
    margin:0% 0 0 0%;
    clear: both;
    z-index: 10;
}

ul.item_05 li.n2 {
    width: 25%;
    margin:-23% 0% 0 2%;
    clear: both;
    z-index: 20;
}

ul.item_05 li.n3 {
    width: 40%;
    margin: -114% 0 0 56%;
    clear: both;
    z-index: 20;
}

ul.item_05 li.n4 {
    width: 30%;
    margin: 15% 0 0 5%;
    z-index: 20;
}

ul.item_05 li.n5 {
    width: 50%;
    margin: 11% 0 0 -10%;
    z-index: 10;
}

ul.item_05 li.n6 {
    width: 50%;
    margin: 0% 0 0 25%;
    clear: both;

}

ul.item_05 li.n7 {
    width: 27.6%;
    margin: 18% 0 0 -7.3%;
}

ul.item_05 li.n8 {
    width: 92%;
    margin: 10% 0 0 4%;
    clear: both;
}

ul.item_06 li.n1 {
    width: 100%;
    margin: 0 0 0 0;
    clear: both;
}

ul.item_06 li.n2 {
    width: 50%;
    margin: -47% 0 0 4.8%;
    clear: both;
}


.clearfix::after {
   content: "";
   display: block;
   clear: both;
}

.checkallitem {
    margin: 5% auto;
    max-width: 550px;
    width: 75%;
}

.conA {
    background: #DF370A;
    width: 100%;
    padding: 5% 0;
    margin: 5% auto;
    position: relative;
}

.inner2{
  width:86%;
  max-width: 650px;
  margin: 0 auto;
}

.inner2 p {color: #fff; text-align: center;}
.inner2 table {width: 100%; color: #fff; margin-top: 50px;}
.inner2 table th,.inner2 table td {padding:0 2% 3% 0;}
.inner2 table .btn,.inner2 table .cs {
    background: tranceparent;
    border-radius: 20px;
    padding: 3px 0;
    color: #DF370A;
    display: block !important;
    text-align: center;
    width: 100px;
    border: 1px solid #fff;
    background: #fff;
}

footer #pagetop {
    top: 0px;
    }


/* arrow */
.slick-arrow{
  z-index: 2;
  top: 50%;
  margin-top: -10px;
  width: 30px;
  height: 30px;
  /*border-top: 3px solid #3498db;
  border-right: 3px solid #3498db;*/
  opacity: .8;
}
.slick-arrow::before{
  content: '';
}
.slick-prev{
  left: -22.5px;
  background: url("../img/btn_back.svg") no-repeat;
}
.slick-next{
  right: -22.5px;
  background: url("../img/btn_next.svg") no-repeat;
}

.slick-prev:hover,.slick-prev:focus{
     opacity: 1;
     background: url("../img/btn_back.svg") no-repeat;
}

.slick-next:hover,.slick-next:focus{
     opacity: 1;
     background: url("../img/btn_next.svg") no-repeat;
}

}


@media print {}