@charset "utf-8";

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 200;
  src: url(https://fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Light.woff2) format('woff2'),
       url(https://fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Light.woff) format('woff'),
       url(https://fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Light.otf) format('opentype');
}

@font-face {
   font-family: 'Noto Sans Japanese';
   font-style: normal;
   font-weight: 300;
   src: url(https://fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-DemiLight.woff2) format('woff2'),
        url(https://fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-DemiLight.woff) format('woff'),
        url(https://fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-DemiLight.otf) format('opentype');
}

@font-face {
   font-family: 'Noto Sans Japanese';
   font-style: normal;
   font-weight: 400;
   src: local('NotoSansJP-Regular.otf'),
        url(https://fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Regular.woff2) format('woff2'),
        url(https://fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Regular.woff) format('woff'),
        url(https://fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Regular.otf) format('opentype');
 }


@font-face {
   font-family: 'Noto Sans Japanese';
   font-style: normal;
   font-weight: 500;
   src: url(https://fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Medium.woff2) format('woff2'),
        url(https://fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Medium.woff) format('woff'),
        url(https://fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Medium.otf) format('opentype');
 }
@font-face {
   font-family: 'Noto Sans Japanese';
   font-style: normal;
   font-weight: 700;
   src: url(https://fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Bold.woff2) format('woff2'),
        url(https://fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Bold.woff) format('woff'),
        url(https://fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Bold.otf) format('opentype');
 }
@font-face {
   font-family: 'Noto Sans Japanese';
   font-style: normal;
   font-weight: 900;
   src: url(https://fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Black.woff2) format('woff2'),
        url(https://fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Black.woff) format('woff'),
        url(https://fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Black.otf) format('opentype');
 }

/* layout
========================================== */
html, body {
	-webkit-text-size-adjust: none;
	background: #fff;
	height: 100%;
}
body{
    color: #000;
	font-size: 14px;
	word-wrap: break-word;
    font-feature-settings: "palt";
    letter-spacing: 0.08em;
	background: transparent;
}
.clearfix::after {
	display: table;
	content: "";
	clear: both;
}
*, *::before, *::after {
	box-sizing: border-box;
	padding: 0;
	margin: 0;
	outline: none;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
img { width: 100%;}
.btn { text-align: center;}
.btn--main {
    display: inline-block;
    text-align: center;
    text-decoration: none;
    font-weight: bold;
    background: #0099ff;
    color: #fff;
}
.txt--link { margin-top: 10px;}
.txt--link a {
    color: #0099ff;
    font-weight: bold;
	position: relative;
}

.animated { opacity: 0;}
@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 50px, 0);
    transform: translate3d(0, 50px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 50px, 0);
    transform: translate3d(0, 50px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.fadeInUp {
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp;
}
.animated.fadeInUp{
	-webkit-animation-duration: .5s;
	animation-duration: .5s;
	opacity: 1;
}
#loading {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 200;
	overflow: hidden;
	background: #fff;
	background-size: 100%;
	-webkit-transition: none;
	transition: none;
}


/* keyvisual
========================================== */
@-webkit-keyframes fadein { 100% { opacity: 1; } }
@keyframes fadein { 100% { opacity: 1; } }

.section--keyvisual { overflow: hidden;}
.section--keyvisual .list--hero-image li,.section--keyvisual .txt h1,.section--keyvisual .txt p,.section--keyvisual .txt .lead,.section--keyvisual .scroll{ opacity: 0;}
/* 0526新潟〜0616福岡 */
.loaded .section--keyvisual .list--hero-image.first li:nth-child(1) { opacity: 0; -webkit-animation: fadein .5s ease 0s 1 forwards; animation: fadein .5s ease 0s 1 forwards; }
.loaded .section--keyvisual .list--hero-image.first li:nth-child(2) { opacity: 0; -webkit-animation: fadein .5s ease 0.8s 1 forwards; animation: fadein .5s ease 0.8s 1 forwards; }
/* 0623広島〜0722京セラ */
.loaded .section--keyvisual .list--hero-image.second li:nth-child(1) { opacity: 0; -webkit-animation: fadein .5s ease 0s 1 forwards; animation: fadein .5s ease 0s 1 forwards; }
.loaded .section--keyvisual .list--hero-image.second li:nth-child(2) { opacity: 0; -webkit-animation: fadein .5s ease .8s 1 forwards; animation: fadein .5s ease .3s 1 forwards; }
.loaded .section--keyvisual .list--hero-image.second li:nth-child(3) { opacity: 0; -webkit-animation: fadein .5s ease 1.6s 1 forwards; animation: fadein .5s ease .6s 1 forwards; }
.loaded .section--keyvisual .list--hero-image.second li:nth-child(4) { opacity: 0; -webkit-animation: fadein .5s ease 2.4s 1 forwards; animation: fadein .5s ease .9s 1 forwards; }

.loaded .section--keyvisual .txt p{ opacity: 0; -webkit-animation: fadein .5s ease 1.2s 1 forwards; animation: fadein .5s ease 1.2s 1 forwards; }
.loaded .section--keyvisual .txt h1{ opacity: 0; -webkit-animation: fadein .5s ease 1.8s 1 forwards; animation: fadein .5s ease 1.8s 1 forwards; }
.loaded .section--keyvisual .txt .lead,.loaded .section--keyvisual .scroll{ opacity: 0; -webkit-animation: fadein .5s ease 2.4s 1 forwards; animation: fadein .5s ease 2.4s 1 forwards; }


/* contents
========================================== */
.section--contents .inner {
    position: relative;
}
.section--contents .inner .box{
    width: 100%;
    height: 100%;
    position: absolute;
    background: rgba(0, 0, 0, 0.5);
    box-sizing: content-box;
    z-index: 90;
}
.section--contents [class^="block--"] {
    position: relative;
    background: transparent;
}
.section--contents .box .line,.section--keyvisual .txt .tit .line{
    position: absolute;
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
}
.section--contents .box .line { background: #fff;}
.section--keyvisual .txt .tit .line { background: #000; z-index:100; opacity: 1;}
.section--contents .box .line-top,.section--contents .box .line-bottom,.section--keyvisual .txt .tit .line-top,.section--keyvisual .txt .tit .line-bottom{
    width: 100%;
    height: 3px;
    left: 0;
    transform: scaleX(0);
    -webkit-transform: scaleX(0);
}
.section--keyvisual .txt .tit .line-top,.section--keyvisual .txt .tit .line-bottom{
	height: 5px;
}
.section--contents .box .line-right,.section--contents .box .line-left,.section--keyvisual .txt .tit .line-right,.section--keyvisual .txt .tit .line-left{
    width: 3px;
    height: 100%;
    top: 0;
    transform: scaleY(0);
    -webkit-transform: scaleY(0);
}
.section--keyvisual .txt .tit .line-right,.section--keyvisual .txt .tit .line-left{
	width: 5px;
}
.section--contents .box .line-top,.section--keyvisual .txt .tit .line-top{
    top: 0;
    transform-origin: left center;
}
.section--contents .box .line-right,.section--keyvisual .txt .tit .line-right{
    right: 0;
    transform-origin: center top;
}
.section--contents .box .line-bottom,.section--keyvisual .txt .tit .line-bottom{
    bottom: 0;
    transform-origin: right center;
}
.section--contents .box .line-left,.section--keyvisual .txt .tit .line-left{
    left: 0;
    transform-origin: center bottom;
}
/* section--contentsの線アニメーション */
.section--contents .box.fadeInUp .line-top{
    transform: scaleX(1);
    -webkit-transform: scaleX(1);
}
.section--contents .box.fadeInUp .line-right{
    transform: scaleY(1);
    transition-delay: .3s;
	-webkit-transform: scaleY(1);
	-webkit-transition-delay: .3s;
}
.section--contents .box.fadeInUp .line-bottom{
    transform: scaleX(1);
    transition-delay: .6s;
	-webkit-transform: scaleX(1);
	-webkit-transition-delay: .6s;
}
.section--contents .box.fadeInUp .line-left{
    transform: scaleY(1);
    transition-delay: .9s;
	-webkit-transform: scaleY(1);
	-webkit-transition-delay: .9s;
}
/* section--keyvisualの線アニメーション */
.loaded .section--keyvisual .txt .tit .line-top{
    transform: scaleX(1);
	transition-delay: .3s;
	-webkit-transform: scaleX(1);
	-webkit-transition-delay: 0s;
}
.loaded .section--keyvisual .txt .tit .line-right{
    transform: scaleY(1);
    transition-delay: .6s;
	-webkit-transform: scaleY(1);
	-webkit-transition-delay: .3s;
}
.loaded .section--keyvisual .txt .tit .line-bottom{
    transform: scaleX(1);
    transition-delay: .9s;
	-webkit-transform: scaleX(1);
	-webkit-transition-delay: .6s;

}
.loaded .section--keyvisual .txt .tit .line-left{
    transform: scaleY(1);
    transition-delay: 1.2s;
	-webkit-transform: scaleY(1);
	-webkit-transition-delay: .9s;
}
.section--contents .block--contents.animated.fadeInUp{
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
}
.section--contents {
    position: relative;
    overflow: hidden;
    height: 100%!important;
}
.section--contents .icon {
    transition: none;
	-webkit-transition: none;
    background: rgba(255, 255, 255, 1);
    color: #0099ff;
    display: block;
    position: absolute;
    z-index: 101;
    font-weight: bold;
    line-height: 1;
    font-family: 'Roboto', sans-serif;
    -webkit-transform: skewY(-5deg);
    transform: skewY(-5deg);
}
.section--contents .icon .num{
    font-weight: bold;
    line-height: 1;
    text-align: center;
}

.background {
    width: 100%;
    height: 100vh;
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
	z-index: -1;
}
.background li {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	opacity: 0;
}
.background li img {
    background-size: cover;
    background-position: center center;
	width: 100%;
	height: 100%;
	transition: none;
	-webkit-transition: none;
}
.background.fanfesta li:first-child,.background.kanpai li:nth-child(2),.background.matsumoto li:nth-child(3),.background.tokyotower li:nth-child(4){ opacity: 1;}

/* detail
========================================== */
.section--detail [class^="block--"],.section--introduction [class^="block--"]{
    background: #fff;
	border: 1px solid #ccc;
}
.section--detail [class^="block--"]:last-of-type,.section--introduction [class^="block--"]:last-of-type{ margin-bottom: 0;}
.section--detail [class^="block--"] .txt--tit { font-weight: bold;}

/* footer
========================================== */
footer {
	color: #aaa;
	background-color: #fff;
	position: relative;
	text-align: center;
}
