@charset "UTF-8";


#main-content .movie-body{ padding-top: 80px; background-color: #000000; }
#main-content .movie{ position: relative; }
#main-content .movie img{ width: 100%; height: auto; }
#main-content .movie video{ width: 100%; height: auto; }
#main-content .movie .copy{ width: 69.6043%; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); }
#main-content .movie .caption{ position: absolute; right: 0; bottom: 0; padding: 2px 5px; background-color: rgba(0,0,0,0.8); color: #ffffff; z-index: 10; }
#main-content .intro{ padding: 50px 0 20px; text-align: center; background-color: #000000; }
#main-content .intro .ttl01{ color: #e2ddbb; }
#main-content .intro .feature-list{ display: flex; display: -ms-flex; justify-content: center; margin-top: 20px; }
#main-content .intro .feature-list .item{ line-height: 1.2; color: #ffffff; position: relative; }
#main-content .intro .feature-list .item01{ font-size: 40px; }
#main-content .intro .feature-list .item01 .head{ font-size: 40%; display: inline-block; }
#main-content .intro .feature-list .item02{ font-size: 36px; margin-left: 30px; padding-left: 30px; }
#main-content .intro .feature-list .item02 .head{ font-size: 70%; line-height: 1.5; display: inline-block; border: 1px solid #ffffff; padding: 0 0.4em; margin-right: 0.2em; }
#main-content .intro .feature-list .item02::before,
#main-content .intro .feature-list .item02::after{ content: ""; position: absolute; left: 0; top: 50%; width: 1px; height: 30px; background-color: #ffffff; }
#main-content .intro .feature-list .item02::before{ transform: translate(-50%,-50%) rotate(45deg); }
#main-content .intro .feature-list .item02::after{ transform: translate(-50%,-50%) rotate(-45deg); }
#main-content .intro .en{ font-family: 'YakuHanMP', 'EB Garamond', 'Cormorant Garamond', 'Lora', 'Noto Serif JP', serif; font-size: 20px; line-height: 1.5; color: #e2ddbb; letter-spacing: 1.5em; padding-left: 1.5em; margin-top: 20px; }
#main-content .intro .en sup{ letter-spacing: 0; font-size: 50%; }
#main-content .intro-photo{ position: relative; }
#main-content .intro-photo img{ width: 100%; height: auto; }
#main-content .intro-photo .caption{ position: absolute; right: 0; bottom: 0; padding: 2px 5px; background-color: rgba(0,0,0,0.8); color: #ffffff; z-index: 10; }
#main-content .view-body{ position: relative; }
#main-content .view-body .icon{ position: absolute; left: 50%; transform: translateX(-50%); width: 53px; z-index: 10; pointer-events: none; margin-top: 210px; transition: opacity 0.5s 3s; }
#main-content .view-body:active .icon,
#main-content .view-body:hover .icon{ opacity: 0; transition-delay: 0s; }
#main-content .view-body .view-photo{ overflow-x: scroll; width: 100%; max-width: 4925px; cursor: move; }
#main-content .view-body .view-photo .photo{ width: 4925px; }
#main-content .view-body .view-photo .photo img{ width: 100%; height: auto; }
#main-content .view-body .en{ font-family: 'YakuHanMP', 'EB Garamond', 'Cormorant Garamond', 'Lora', 'Noto Serif JP', serif; font-size: 28px; line-height: 1.5; color: #897254; position: absolute; left: 50%; top: 0; z-index: 10; letter-spacing: 1em; padding-left: 1em; transform: translateX(-50%); margin-top: 50px; }
#main-content .view-body .info{ position: absolute; right: 0; top: 0; width: 326px; margin: 50px 5% 0 0; }
#main-content .view-body .caption{ position: absolute; right: 0; bottom: 0; padding: 2px 5px; background-color: rgba(0,0,0,0.8); color: #ffffff; z-index: 10; }
#main-content .section01{ margin-top: 80px; }
#main-content .section01 .ttl01{ color: #948a54; }
#main-content .section01 .txt{ padding: 0 5%; max-width: 1112px; margin: 40px auto 0; }
#main-content .section01 .view-illust-body{ position: relative; margin-top: 20px; }
#main-content .section01 .view-illust-body .icon{ position: absolute; left: 50%; transform: translateX(-50%); width: 53px; z-index: 10; pointer-events: none; margin-top: 180px; transition: opacity 0.5s 3s; }
#main-content .section01 .view-illust-body:active .icon,
#main-content .section01 .view-illust-body:hover .icon{ opacity: 0; transition-delay: 0s; }
#main-content .section01 .view-illust-body .view-illust{ overflow-x: scroll; width: 100%; max-width: 1895px; cursor: move; }
#main-content .section01 .view-illust-body .view-illust .photo{ width: 1895px; }
#main-content .section01 .view-illust-body .view-illust .photo img{ width: 100%; height: auto; }
#main-content .section01 .view-illust-body .caption{ position: absolute; right: 0; bottom: 0; padding: 2px 5px; background-color: rgba(255,255,255,0.8); z-index: 10; }
#main-content .section01 .view-caption{ padding: 0 5%; max-width: 1112px; margin: 10px auto 0; }
#main-content .section01 .split-view{ display: flex; display: -ms-flex; justify-content: space-between; width: 824px; margin: 70px auto 0; }
#main-content .section01 .split-view .photo-body{ width: 61.6505%; }
#main-content .section01 .split-view .txt-body{ width: 32.767%; }
#main-content .section01 .split-view .txt-body .list-item{ border: 1px solid #cccccc; padding: 15px 20px; }
#main-content .section01 .split-view .txt-body .list-item .item{ color: #000000; }
#main-content .section01 .split-view .txt-body .list-item .item .icon{ width: 1em; height: 1em; margin-right: 0.5em; display: inline-block; border: 1px solid #cccccc; transform: translateY(0.1em); }
#main-content .section01 .split-view .txt-body .list-item .item .icon01{ background-color: #86cab6; }
#main-content .section01 .split-view .txt-body .list-item .item .icon02{ background-color: #fffac6; }
#main-content .section01 .split-view .txt-body .list-item .item .icon03{ background-color: #b6cf68; }
#main-content .section01 .split-view .txt-body .list-item .item .icon04{ background-color: #dbe4ac; }
#main-content .section01 .split-view .txt-body .list-item .item .icon05{ background-color: #eabca6; }
#main-content .section02{ margin-top: 80px; padding: 80px 0; background-color: #f2f2f2; }
#main-content .section02 .ttl01{ color: #948a54; }
#main-content .section02 .inner-sec01{ margin: 30px auto 0; max-width: 1080px; }
#main-content .section02 .inner-sec01 .split-view{ display: flex; display: -ms-flex; justify-content: space-between; align-items: flex-end; }
#main-content .section02 .inner-sec01 .split-view .first{ width: 62.2222%; }
#main-content .section02 .inner-sec01 .split-view .second{ width: 25.9259%; }
#main-content .section02 .inner-sec01 .caption{ margin-left: 5%; }
#main-content .section02 .inner-sec02{ margin: 50px auto 0; padding-top: 50px; max-width: 1080px; border-top: 1px solid #cccccc; }
#main-content .section02 .inner-sec02 .split-view{ position: relative; overflow: hidden; }
#main-content .section02 .inner-sec02 .split-view .first{ width: 66.0185%; position: relative; z-index: 5; margin-top: 80px; }
#main-content .section02 .inner-sec02 .split-view .second{ width: 51.8518%; position: absolute; right: 0; top: 0; }
#main-content .section02 .inner-sec02 .split-view .second .caption{ position: absolute; right: 0; bottom: 0; padding: 2px 5px; background-color: rgba(0,0,0,0.8); color: #ffffff; z-index: 10; }
#main-content .section03{ margin-top: 80px; }
#main-content .section03 .en-ttl{ font-family: 'YakuHanMP', 'EB Garamond', 'Cormorant Garamond', 'Lora', 'Noto Serif JP', serif; font-size: 28px; line-height: 1.5; color: #897254; letter-spacing: 1em; padding-left: 1em; text-align: center; }
#main-content .section03 img{ max-width: 100%; height: auto; }
#main-content .section03 .plan-body{ margin: 50px auto 0; max-width: 1121px; }
#main-content .section03 .plan-body+.plan-body{ margin-top: 80px; }
#main-content .section03 .plan-body .split-view{ display: flex; display: -ms-flex; align-items: center; }
#main-content .section03 .plan-body .split-view .plan-head{ display: flex; display: -ms-flex; flex-wrap: wrap; align-items: center; width: 380px; }
#main-content .section03 .plan-body .split-view .plan-head .type{ padding: 10px; font-size: 18px; line-height: 1.5; font-family: 'YakuHanMP', 'EB Garamond', 'Cormorant Garamond', 'Lora', 'Noto Serif JP', serif; color: #a4942d; background-color: #f0eedd; }
#main-content .section03 .plan-body .split-view .plan-head .type .marker{ font-size: 266%; line-height: 1; }
#main-content .section03 .plan-body .split-view .plan-head .ldk{ font-size: 58px; line-height: 1; color: #a4942d; font-family: 'YakuHanMP', 'EB Garamond', 'Cormorant Garamond', 'Lora', 'Noto Serif JP', serif; margin-left: 10px; padding-left: 10px; border-left: 1px solid #c5bb7e; }
#main-content .section03 .plan-body .split-view .plan-head .ldk .s-size{ font-size: 41.3793%; display: block; }
#main-content .section03 .plan-body .split-view .plan-head .feature{ width: 100%; background-color: #9b0000; color: #ffffff; font-size: 20px; line-height: 1.2; text-align: center; padding: 10px 0; margin-top: 10px; }
#main-content .section03 .plan-body .split-view .plan-info{ padding-left: 50px; }
#main-content .section03 .plan-body .split-view .plan-info *{ color: #040000; }
#main-content .section03 .plan-body .split-view .plan-info .area{ font-size: 24px; line-height: 1.5; }
#main-content .section03 .plan-body .split-view .plan-info .area .head{ font-size: 75%; display: block; }
#main-content .section03 .plan-body .split-view .plan-info .area .num{ font-size: 179%; line-height: 1.2; }
#main-content .section03 .plan-body .split-view .plan-info .area .num .marker{ font-size: 132.5581%; line-height: 0; }
#main-content .section03 .plan-body .split-view .plan-info .spec{ font-size: 18px; line-height: 1.5; }
#main-content .section03 .plan-body .plan{ text-align: center; margin-top: 20px; }
#main-content .section03 .plan-caption{ max-width: 1112px; margin: 50px auto 0; }
#main-content .section03 .plan-caption .caption+.caption{ margin-top: 1em; }
#main-content .section03 .plan-caption .caption .icon{ width: 2em; height: 1em; margin: 0.1em 0.2em 0 0; background-color: #000; display: inline-block; }
#main-content .section03 .plan-caption .caption .icon01{ background-color: #eae5d5; }
#main-content .section03 .plan-caption .caption .icon02{ background-color: #f7eaea; }
#main-content .section03 .plan-caption .caption .icon03{ background-color: #ffd088; }
#main-content .section03 .plan-caption .caption .icon04{ background-color: #bdd0a2; }
#main-content .section03 .navi{ max-width: 420px; margin: 50px auto 0; }
#main-content .section03 .navi a{ display: block; background-color: #140600; color: #ffffff; font-size: 18px; line-height: 1.5; padding: 20px 0; text-decoration: none; text-align: center; position: relative; }
#main-content .section03 .navi a .arrow{ position: absolute; right: 15px; top: 50%; width: 26px; height: 26px; background-color: #ac9a75; transform: translateY(-50%); border-radius: 50%; }
#main-content .section03 .navi a .arrow::before{ content: ""; position: absolute; left: 50%; top: 50%; transform: translateX(-25%) translate(-50%,-50%) rotate(45deg); width: 7px; height: 7px; border: solid #000000; border-width: 1px 1px 0 0; }





/*--レスポンシブ追加プロパティ--------------------------------------*/
@media screen and (max-width: 1112px){ /*1112px以下のcss*/
}
@media screen and (max-width: 768px){ /*768px以下のcss*/
	#main-content .movie-body{ padding-top: 0; }
	#main-content .view-body:hover .icon{ opacity: 1; }
	#main-content .intro{ padding: 7% 0; }
	#main-content .intro .feature-list{ display: block; margin-top: 5%; }
	#main-content .intro .feature-list .item{ line-height: 1.2; color: #ffffff; position: relative; }
	#main-content .intro .feature-list .item01{ font-size: 6.249vw; }
	#main-content .intro .feature-list .item01 .head{ font-size: 40%; display: inline-block; }
	#main-content .intro .feature-list .item02{ font-size: 5.625vw; margin: 5% 0 0; padding: 5% 0 0; }
	#main-content .intro .feature-list .item02::before,
	#main-content .intro .feature-list .item02::after{ left: 50%; top: 0; height: 5vw; }
	#main-content .intro .en{ font-size: 3vw; margin-top: 5%; }
	#main-content .section01{ margin-top: 10%; }
	#main-content .section01 .txt{ margin-top: 5%; }
	#main-content .section01 .split-view{ display: block; width: auto; margin: 5% auto 0; padding: 0 5%; }
	#main-content .section01 .split-view .photo-body{ width: 100%; }
	#main-content .section01 .split-view .txt-body{ width: 100%; margin-top: 5%; }
	#main-content .section01 .split-view .txt-body .list-item{ padding: 5%; }
	#main-content .section02{ margin-top: 10%; padding: 10% 5%; }
	#main-content .section02 .inner-sec01{ margin: 5% auto 0; }
	#main-content .section02 .inner-sec01 .split-view{ display: block; }
	#main-content .section02 .inner-sec01 .split-view .first{ width: 100%; text-align: center; }
	#main-content .section02 .inner-sec01 .split-view .second{ width: 100%; text-align: center; margin-top: 5%; }
	#main-content .section02 .inner-sec01 .caption{ margin-left: 0; }
	#main-content .section02 .inner-sec02{ margin: 7% auto 0; padding-top: 7%; }
	#main-content .section02 .inner-sec02 .split-view .first{ width: 100%; margin-top: 0; }
	#main-content .section02 .inner-sec02 .split-view .second{ width: 100%; position: relative; right: auto; top: auto; margin-top: 5%; }
	#main-content .section02 .inner-sec02 .split-view .second img{ width: 100%; height: auto; }
	#main-content .section03{ margin-top: 10%; padding: 0 5%; }
	#main-content .section03 .en-ttl{ font-size: 24px; }
	#main-content .section03 .plan-body{ margin: 5% auto 0; }
	#main-content .section03 .plan-body+.plan-body{ margin-top: 10%; }
	#main-content .section03 .plan-body .split-view{ display: block; }
	#main-content .section03 .plan-body .split-view .plan-head{ width: auto; }
	#main-content .section03 .plan-body .split-view .plan-head .ldk{ font-size: 46px; }
	#main-content .section03 .plan-body .split-view .plan-head .ldk .s-size{ display: inline-block; }
	#main-content .section03 .plan-body .split-view .plan-head .feature{ font-size: 18px; }
	#main-content .section03 .plan-body .split-view .plan-info{ padding-left: 0; margin-top: 10px; }
	#main-content .section03 .plan-body .split-view .plan-info .area{ font-size: 20px; }
	#main-content .section03 .plan-body .split-view .plan-info .spec{ font-size: 16px; }
	#main-content .section03 .plan-body .plan{ margin-top: 10px; }
	#main-content .section03 .plan-caption{ margin: 5% auto 0; }
	#main-content .section03 .navi{ margin: 7% auto 0; }
	#main-content .section03 .navi a{ font-size: 16px; }
}
@media screen and (max-width: 480px){ /*480px以下のcss*/
}