@charset "UTF-8";

@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);
body{font-family: 'Noto Sans JP', sans-serif;}
/* clearfix */
.clearfix01:before,
.clearfix01:after{content:"";display:block;overflow:hidden;}
.clearfix01:after{clear:both;}
.clearfix01{zoom:1;}

/* add normalize */
dl,menu,ol,ul{margin:1em 0;}
dd{margin:0 0 0 40px;}
menu,ol,ul{padding:0 0 0 40px;}
nav ul,nav ol{list-style:none;list-style-image:none;}
h1,h2,h3,h4,h5,h6{margin:0;padding:0;font-weight:normal;line-height:1.4;}
a{text-decoration: none;}
p{margin: 0 0 10px;}
/* common class */
.txt-wh{color: #fff;}
.bold{font-weight:bold;}
.ta-c{text-align: center;}
.anim{
  opacity: 0;
  transform: translate(0, 50px);
  transition: all 500ms;
}
.anim.scrollin {
  opacity: 1;
  transform: translate(0, 0);
  transition-delay: 0.3s;
}


/*load*/

#loader-bg {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    background: #2f2d33;
    z-index: 2000;
}

.group {
	position: fixed;
	top: 48%;
	left: 48%;
	line-height: 16px;
	z-index: 2500;
	text-align: center;
}

.bigSqr {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 40px;
  overflow: hidden;
  -webkit-transform-origin: bottom left;
          transform-origin: bottom left;
  -webkit-animation: bigSqrShrink 1s linear infinite;
          animation: bigSqrShrink 1s linear infinite;
}

.square {
  position: absolute;
  width: 20px;
  height: 20px;
  background: #094567;
}

.first {
	left: 0px;
	top: 22px;
	background: linear-gradient(-90deg,#3598ad, #0a4769);
}

.second {
	left: 22px;
	top: 22px;
	background: linear-gradient(-90deg,#56d6e2, #3598ad);
	-webkit-animation: drop2 1s linear infinite;
		  animation: drop2 1s linear infinite;
}

.third {
  left: 0px;
  top: 0px;
	background: linear-gradient(-90deg,#3598ad, #0a4769);

  -webkit-animation: drop3 1s linear infinite;
          animation: drop3 1s linear infinite;
}

.fourth {
  left: 22px;
  top: 0px;
	background: linear-gradient(-90deg,#56d6e2, #3598ad);

  -webkit-animation: drop4 1s linear infinite;
          animation: drop4 1s linear infinite;
}

.text {
  line-height: 16px;
  font-family: "Open Sans", "Roboto", Arial, sans-serif;
  font-weight: 400;
  color: #FFF;
  display: block;
  margin: 10px auto;
  padding: 3px;
}

@-webkit-keyframes bigSqrShrink {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  90% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
  }
}

@keyframes bigSqrShrink {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  90% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
  }
}
@-webkit-keyframes drop2 {
  0% {
    -webkit-transform: translateY(-50px);
            transform: translateY(-50px);
  }
  25% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
}
@keyframes drop2 {
  0% {
    -webkit-transform: translateY(-50px);
            transform: translateY(-50px);
  }
  25% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
}
@-webkit-keyframes drop3 {
  0% {
    -webkit-transform: translateY(-50px);
            transform: translateY(-50px);
  }
  50% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
}
@keyframes drop3 {
  0% {
    -webkit-transform: translateY(-50px);
            transform: translateY(-50px);
  }
  50% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
}
@-webkit-keyframes drop4 {
  0% {
    -webkit-transform: translateY(-50px);
            transform: translateY(-50px);
  }
  75% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
}
@keyframes drop4 {
  0% {
    -webkit-transform: translateY(-50px);
            transform: translateY(-50px);
  }
  75% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
}

@media (max-width: 468px) {
	.group {
		left: 42%;
	}
}

/*header*/
#global-head {
	position: fixed;
	z-index: 1000;
	width: 100%;
	padding: 10px 10px 10px 16px;
	background-color: #fff;
	height: 60px;
	top:0;
}
#global-head .logo {
	margin: 0 20px 0;
	display: inline-block;
}

#global-head h2{
	display: inline-block;
	vertical-align: top;
    padding-top: 26px;
}
#global-head h2 .en-f{
	color:#003f66;
	font-size: 24px;
}
#global-head h2 .jp-f{
	color:#333;
	font-size: 20px;
}
#sidebar-sp {display: none;}
#sidebar {
  position: fixed;
  right: 0;
  top: 0;
  height: 100%;
  width: 840px;
  background-color: #fff;
  height: 80px;
  z-index: 1300;
	display: block;
}
#sidebar .button, #sidebar .button::before, #sidebar .button::after {
-webkit-transition: all .3s;
transition: all .3s; 
}
#sidebar .nav {
	position: relative;
	display: block; 
}

#sidebar .nav > ul {
	display: table;
	margin: 0;
	padding: 0;
	height: 100%;
	position: absolute;
	right: 0; 
}
#sidebar .nav > ul > li {
	display: table-cell;
	vertical-align: middle;
	padding: 0px 20px 0 0;
	height: 80px;
	line-height: 2.8;
}


#sidebar .nav > ul > li > a {
	display: block;
	height: 100%;
	padding: 0;
	font-size: 0.9em;
	padding-top: 16px;
	text-decoration: none;
}

#sidebar .nav li.btn_c a:hover{
	text-decoration: none;
}



#sidebar .nav > ul > li > a.mover {
	border-bottom: 4px solid rgba(195,0,47,0);
	color: #333;

}
#sidebar .nav > ul > li > a.current {
	color: #003f66 !important;
	border-bottom: 4px solid #003f66 !important; 
}
#sidebar .nav > ul > li > a:hover.mover {
	color: #003f66; 
	text-decoration: none;
	border-bottom: 4px solid rgba(195,0,47,1);
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
}


#sidebar .nav > ul > li.entry{
	padding-right: 0;	
}
#sidebar .nav > ul > li.entry > a.mover{
	color: #fff;
	padding-left:20px;
	padding-right:20px;
	background-color: #003f66;
	border-bottom: none;
	font-weight: 700;
}
#sidebar .nav > ul > li.login{
	padding-right: 0;	
}
#sidebar .nav > ul > li.login > a.mover{
	color: #fff;
	padding-left:20px;
	padding-right:20px;
	background-color: #8f8f8f;
	border-bottom: none;
	font-weight: 700;	
}


#sidebar .nav span {
	background: #89be17;
	height: 3px;
	display: block;
	position: absolute;
	width: 0;
	left: 0;
	bottom: 0; 
}
#sidebar .nav li.btn_c {
	text-align: center;
	width: 92px;
	padding-right: 0 !important;
}
#sidebar .nav li.btn_c a {
	color: #ffffff;
	letter-spacing: 0px;
	border: none; 
}
#sidebar .nav li.btn_c div {margin-bottom: 5px;}
#sidebar .nav li.btn_c a:hover {
	color: #fff;
	border-bottom:none;
}
#sidebar .nav li.btn_c1 {background-color: #8f8f8f; }
#sidebar .nav li.btn_c2 {background-color: #003f66; }

#sidebar .button {
	position: relative;
	z-index: 2;
	overflow: hidden; 
}
#sidebar .button:hover {color: #fff; }
#sidebar .button::after {
	left: -100%;
	top: 0;
	width: 100%;
	height: 100%; 
}
#sidebar .button:hover::after {left: 0; }
#sidebar .nav li.btn_c1:hover::after {
	background-color:#515151;
}
#sidebar .nav li.btn_c2:hover::after {
	background-color:#012d48; 
}
#sidebar .button::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: ''; 
}

/*** pull down ***/
.nav ul.sub {
	display: none;
	position: absolute;
	margin-left: 0;
	margin-top: 0;
	padding: 10px;
	background-color: #f5f5f5;
}
.nav ul.sub li a {
	padding: 5px 10px;
	margin-left: -5px;
	margin-right: -5px;
	margin-bottom: -5px;
	display: block;
	color: #000;
	line-height: 1.8;
	font-size: 0.8em;
}
.nav ul.sub li a:hover {color: #003f66; text-decoration: none;}

.nav ul.entry-r{
	right: 0;
}


.menu-trigger {
	display: none;
	position: fixed;
	top: 15px;
	right: 15px;
	height: 32px;
	z-index: 1400;
}
.menu-trigger > div {position: relative;width: 32px; }
.menu-trigger span {
	width: 100%;
	height: 2px;
	left: 0;
	display: block;
	background: #333;
	position: absolute;
	-webkit-transition: .35s ease-in-out;
	-moz-transition: .35s ease-in-out;
	transition: .35s ease-in-out;
}
.menu-trigger span:nth-child(1) {top: 0; }
.menu-trigger span:nth-child(2) {top: 11px; }
.menu-trigger span:nth-child(3) {top: 22px; }


#overlay {
  display: none;
  position: fixed;
  background: rgba(0, 0, 0, 0.6);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1200; }

/* transition */
header, header .logo, header .logo img, .nav li, .nav li a, .open,#global-head{
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease; 
}


#global-head h2 .en-f{
	font-size: 20px;
}
#global-head h2 .jp-f{
	font-size: 18px;
}

#sidebar.fixed .nav > ul > li {
	height: 80px;
}
#sidebar.fixed .nav > ul > li > a{
	padding-top: 28px;
}
#sidebar.fixed {height: 80px; }

#pc-footer-block01-01{
	position: relative;
}
#pagetop{
	position: absolute;
	bottom:10px;
	right:0;
	z-index: 200;
}
#pagetop a{
	display: block;
	width: 100%;
	height: 100%;
}

@media (max-width: 1100px) {
	#global-head { height: 60px; }
	#global-head .logo { margin: 0 16px 0 0; }
	#global-head .logo img { width: auto; height: 54px; }
	#global-head h2{padding-top: 24px;}
	#sidebar{display:none;}
	#sidebar-sp {
		display: block;
		right: -400px;
		width: 400px;
		background-color: #003f66;
		height: 100%;
		position: fixed;
		z-index: 1300;

	}
	#sidebar-sp .nav > ul {
		margin: 100px auto 0;
		position: static;
		padding: 0 40px;
	}
	#sidebar-sp .nav > ul > li {
		display: block;
		text-align: center;
		padding: 0;
		height: auto;
		line-height: 1.2;
	}
	#sidebar-sp .nav > ul > li > a {
		text-decoration: none;
		display: block;
		padding: 15px 0;
		color: #fff;
		-moz-transition: background-color .3s linear;
		-webkit-transition: background-color .3s linear;
		transition: background-color .3s linear;
	}
	#sidebar-sp .nav > ul > li > a:hover {color: #ed8d8d; }
	#sidebar-sp .nav > ul > li > a.mover {
		border-bottom: none !important;
		color:#fff !important;
	}
	#sidebar-sp .nav > ul > li > a:hover.mover {color: #ed8d8d;}
	
	#sidebar-sp .nav > ul > li.login > a.mover{
		background-color: #003f66;
	}

	
	#sidebar-sp .nav li.btn_c {
		background-color: #003f66 !important;
		width: auto;
		padding: 0 0 0 0;
	}
	#sidebar-sp .nav li.btn_c a {
		color: #fff;
		font-weight: bold;
	}
	#sidebar-sp .nav li.btn_c a:hover {color: #ed8d8d;-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	transition: .5s ease-in-out; }
	#sidebar-sp .button::after {position: static; }
	#sidebar-sp .nav > ul > li > a.current {
		color: #fff !important;
		font-weight: bold;
	}
	
	.menu-trigger {display: block;margin-top: 10px;}

	.open {overflow: hidden; }

	.open #overlay {display: block; }

	.open #sidebar-sp {
		-webkit-transform: translate3d(-400px, 0, 0);
		transform: translate3d(-400px, 0, 0);
		-webkit-transition: .35s ease-in-out;
		transition: .35s ease-in-out;
	}

  /* #menu-trigger close */
	.open .menu-trigger span:nth-child(1) {
		top: 11px;
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		transform: rotate(45deg);
		background: #fff;
	}

  	.open .menu-trigger span:nth-child(2) {
		width: 0;
		left: 50%;
		background: #fff;
	}

	.open .menu-trigger span:nth-child(3) {
		top: 11px;
		-webkit-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		transform: rotate(-45deg); 
		background: #fff;
	}

	.nav ul.sub {
		display: none;
		position: relative;
		left:0;
		top:0;
		margin-left: 0;
		margin-top: 10px;
		padding: 0;
		width: 400px;
		background-color: #012d48;
	}
	.nav ul.sub li a{
		color: #fff;
		margin: 0;
	}
	.nav ul.sub li a:hover {color: #003f66; text-decoration: none;}
}


@media (max-width: 480px) {
	#sidebar-sp {
		display: block;
		right: -100%;
		width: 100%;
		background-color: #003f66;
		height: 100%;
		position: fixed;
		z-index: 1300;

	}
	.open #sidebar-sp {
		-webkit-transform: translate3d(-100%, 0, 0);
		transform: translate3d(-100%, 0, 0);
		-webkit-transition: .35s ease-in-out;
		transition: .35s ease-in-out;
	}
}



.ff_ro{
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
}
.ff_ro_t{
	font-family: 'Roboto', sans-serif;
	font-weight: 100;
}
.ff_ro_l{
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
}
.ff_ro_m{
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
}

a {
    outline: none;
}





.br-sp{display: none;}
.br-sp2{display: none;}
.br-pc{display: block;}
.fc_blue{color:#094567;}
.pcttl{display:block;}
.spttl{display:none;}


/* BIG VIDEO BACKGROUND
================================================== */
.big-background {
	z-index:550;
	text-align:center;
	height:100%;
	min-height:100%;
	position:relative;
	overflow:hidden;		
}
.pattern {
    background-image:url(../images/pattern.png);
    background-repeat: repeat;
    background-attachment:scroll;
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0
}

.big-background-bg {
	background: url(../images/mv_bg_img.jpg) no-repeat center;
	background-size: cover;
	z-index:0;
	height:100%;
	min-height:100%;
	width: 100%;
}
.big-background-copy {
	width:100%;
	max-width:100%;
	display:inline-block;
	position:absolute;
	top:50%;
	left:50%;
	z-index: 1600;
    -webkit-transform:translate(-50%,-50%);
    -moz-transform:translate(-50%,-50%);
    -ms-transform:translate(-50%,-50%);
    -o-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%)
}
.big-background-copy{
	z-index: 1000;
}

.big-background .big-background-container {
	width:100%;
	max-width:100%;
	display:inline-block;
	position:absolute;
	bottom:50px;
	left:50%;
	z-index: 1700;
	-webkit-transform:translate(-50%,0);
	-moz-transform:translate(-50%,0);
	-ms-transform:translate(-50%,0);
	-o-transform:translate(-50%,0);
	transform:translate(-50%,0);
}

.big-background .big-background-container .mv_scr {
	color:#fff;
	font-size: 1.0rem;
	position: absolute;
	bottom:0;
	letter-spacing: 1.2px;
}
.big-background .big-background-container .mv_scr:hover {
	text-decoration: none;
	opacity: 0.6;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
}
.big-background .big-background-container .mv_scr span {
  position: absolute;
  top: 25px;
  left: 50%;
  width: 12px;
  height: 12px;
  margin-left: -6px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-animation: sdb 2s infinite;
  animation: sdb 2s infinite;
  box-sizing: border-box;
}
@-webkit-keyframes sdb {
  0% {
    -webkit-transform: rotate(-45deg) translate(0, 0);
  }
  20% {
    -webkit-transform: rotate(-45deg) translate(-10px, 10px);
  }
  40% {
    -webkit-transform: rotate(-45deg) translate(0, 0);
  }
}
@keyframes sdb {
  0% {
    transform: rotate(-45deg) translate(0, 0);
  }
  20% {
    transform: rotate(-45deg) translate(-10px, 10px);
  }
  40% {
    transform: rotate(-45deg) translate(0, 0);
  }
}


a.big-background-btn {
	font-family:'Lato',sans-serif;
	font-size:13px;
	text-transform:uppercase;
	text-decoration:none;
	color:#fff;
	background:transparent;
	border:2px solid #fff;
	padding:10px 14px;
	cursor:pointer;
	letter-spacing:2px;
	text-align:center;
	display:inline-block;
	-webkit-transition:.4s background ease;
	-moz-transition:.4s background ease;
	-o-transition:.4s background ease;
	transition:.4s background ease;
}

.big-background-btn:hover {
	color:#fff;
	background:rgba(255,255,255,0.20)
}

.big-background-default-image {
	background:url(../images/sunset.jpg);
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	width:100%;
	height:100%;
	z-index:0;
	backface-visibility:hidden
}
.wrapper {
	z-index:600;
	position:relative;
}
html {
	height:100%
}
body {
	margin:0;
	padding:0;
	height:100%;
	width:100%;
	-webkit-font-smoothing:antialiased;
	-webkit-text-size-adjust:100%;
	background:none;
	overflow-x:unset;
}
body.open{
	height:auto;
}
#pc-all01-01{
	max-width: 100%;
}
.wrap {
	width: 1280px;
	margin: 0 auto;
}

@media (max-width: 1300px) {
	.wrap{
		width: 100%;
	}
}
.mv_sp{display: none;}

@media (max-width: 768px) {
	.mv_sp{display: block;}
	.big-background{
		display: none;
	}
	.big-background-bg{
		background-image:none; 
	}
	.mv_sp{width: 100%; height: 800px; padding: 0; margin: auto;line-height: 0; position: relative;text-align: center;}
	.mv_sl{width: 100%; height: 800px; padding: 0; margin: 80px 0 0 0;line-height: 0;}
	.mv_sp .big-background-copy{
		margin-top: 0;
		top:42%;
		
	}
	.mv_sp .mv-copy{
		margin-top: 40px;
		margin-bottom: 10px;
	}
	.mv_sp .mv-txt{
		padding: 10px 80px;
	}
	.br-sp{display: block;}
	.br-pc{display: none;}
}
@media (max-width: 480px) {
	.mv_sp{height: 600px;}
	.mv_sp .mv-txt{
		font-size: 0.85rem;
		padding: 10px 20px;
	}
	.br-sp2{display: block;}
	.mv_sp .big-background-copy{
		margin-top: 0;
		top:48%;
		
	}
	.pcttl{display:none;}
	.spttl{display:block;}
	.mv_sp .mv-copy{padding: 5px;}

}


.bg-grad01{
	background: linear-gradient(90deg,#0a4668, #56d7e3);
}

.ttl-ip{
	padding:12px 60px;
	font-size: 1.4rem;
}
.ttl-ip2{
	padding:8px 50px;
	font-size: 1.2rem;
}
.mv-copy{margin: 30px auto;}
.mv-copy span{
	font-size: 3.4rem;
	font-weight: 500;
	padding:0 10px 5px;
}
.mv-txt{font-size: 1.1rem;font-weight:300;line-height: 1.8;}

.txt-st{
	font-size: 1.0rem;
	line-height: 1.8;
}

@media (max-width: 1000px) {
	.ttl-ip{
		padding:12px 40px;
		font-size: 1.4rem;
	}
	.ttl-ip2{
		padding:8px 30px;
		font-size: 1.2rem;
	}
	.mv-copy{
		margin: 30px auto;
	}
	.mv-copy span{
		font-size: 5vw;
		padding:0 10px 5px;
	}
	.mv-txt{
		font-size: 1.1rem;
		font-weight:300;
		line-height: 1.8;
	}

	.txt-st{
		font-size: 1.0rem;
		line-height: 1.8;
	}
}

@media (max-width: 768px) {
	.ttl-ip{
		padding:12px 16px;
		font-size: 1.2rem;
	}
	.ttl-ip2{
		padding:8px 20px;
		font-size: 1.1rem;
	}
	.mv-copy{
		font-size: 5vw;
		padding: 10px;
		width: 70%;
	}

}
@media (max-width: 480px) {
	.txt-st{
		font-size: 0.85rem;
	}
	.ttl-ip{
		font-size:1.0rem;
	}
	.mv-copy{
		font-size: 1.6rem;
		width: 90%;
	}
}

.ie{display: none;}
/* section01
================================================== */
#section01{
	background-color: #2f2d33;
	margin: 0;
}
#section01 .bg-wrap{
	background: url(../images/bg_sec01.png) no-repeat;
	background-position:right 5% center;
	padding: 100px 0;
}
#section01 .h2ttl{font-size: 7rem;}
#section01 .h2ttl span{
	background: linear-gradient(90deg, rgba(16,113,168,1) 0%,rgba(68,159,217,1) 50%,rgba(86,214,226,1) 100%);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
}
#section01 .txt-box{
	width: 60%;
}


#section01 .area-gl{
	background: url(../images/bg_sec1_2.png) repeat;
	padding: 60px 0;
}
#section01 .area-gl .contents-wrap{
	width:850px;
	text-align: center;
	margin: 0 auto;
}
#section01 .area-gl .contents-wrap .blc01{
	background-color: #fff;
	padding: 40px;
}
#section01 .area-gl .contents-wrap .arrow1{
	z-index: 600;
	margin-top: -14px;
}
#section01 .area-gl .contents-wrap .blc02{
	background-color: #fff;
	padding: 35px 20px 30px;
	margin-top: -20px;
}
#section01 .area-gl .contents-wrap .blc01 h3{
	font-size: 3rem;
}
#section01 .area-gl .contents-wrap .blc01 p{
	font-size: 1.2rem;
	margin: 0;
}
#section01 .area-gl .contents-wrap .blc02 p{
	font-size: 1.1rem;
	margin: 0;
	line-height: 1.8;
}

@media (max-width: 1000px) {
	#section01 .bg-wrap{
		background-position:right 3% bottom 14%;
		padding: 50px 0;
	    background-size: 50%;
	}
	#section01 .h2ttl{
		font-size: 10vw;
		padding-left: 30px;
	}
	#section01 .txt-box{
		width: 80%;
		padding-left: 30px;
	}

}

@media (max-width: 768px) {
	.txt-st{
		font-size: 0.9rem;
		line-height: 1.8;
	}

	#section01 .h2ttl{font-size: 5rem;}
	#section01 .txt-box{
		width: 80%;
	}
}

@media (max-width: 480px) {
	#section01 .h2ttl{
		font-size: 4rem;
		text-align: center;
		line-height: 1;
		padding: 0 10px;
	}

	#section01 .txt-box{
		width: 90%;
		padding: 20px 5% 100px;

	}
	
	#section01 .bg-wrap{
		background-position:right 5% bottom 2%;
	    background-size: 60%;
	}

}



	
/* section02
================================================== */
#section02{
	background-color: #0d0e0f;
	margin: 0;
}
#section02 .bg-sec02{
	background: url(../images/bg_sec2.jpg) no-repeat top;
	background-size:100% auto;
	width: 100%;
	padding: 80px 0;
}

#section02 .h2ttl{font-size: 7rem; text-align: center;}
#section02 .h2ttl span{
	background: linear-gradient(90deg, rgba(16,113,168,1) 0%,rgba(68,159,217,1) 50%,rgba(86,214,226,1) 100%);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
}
#section02 .h3ttl{font-size: 2.0rem; text-align: center;margin-top: 0;}
#section02 .h3ttl span{
	background: linear-gradient(90deg, rgba(16,113,168,1) 0%,rgba(68,159,217,1) 50%,rgba(86,214,226,1) 100%);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
}
#section02 .txt02{margin-top: 30px;}
#section02 .h3ttl2{
	font-size: 2.2rem;
	width: 960px;
	padding: 8px 10px;
	margin: 50px auto 20px;
}

#section02 .flow{
	overflow: hidden;
}
#section02 .day{
	background:#fff;
	display: table;
	margin: 0 auto;
	width: 960px;
}
#section02 .day .l{
	display: table-cell;
	vertical-align: top;
	text-align: left;
	position: relative;
}
#section02 .day .l .num{
	background: #094567;
	color: #fff;
	padding: 16px 28px;
	position: absolute;
	top:16px;
	left: 0;
	text-align: center;
	font-size: 1.2rem;
}
#section02 .day .l .num span{
	font-size: 2.2rem;
}
#section02 .day .l .h3-day{
	font-size: 1.6rem;
	padding: 46px 20px 40px 110px;
}
#section02 .day .l .txt{
	margin: 20px 20px 30px 40px;
	font-weight: 300;
	line-height: 1.8;	
}
#section02 .day .r{
	display: table-cell;
	vertical-align: middle;
	width: 348px;
	height: 100%;
	color: #fff;
	font-size: 1.4rem;

}
#section02 .day1 .r{
	background: url(../images/bg_sec3_2.jpg) no-repeat;
	background-size: 110%;
	background-position: center;
}
#section02 .day2 .r{
	background: url(../images/bg_sec3_3.jpg) no-repeat;
	background-size: 110%;
	background-position: center;
}
#section02 .day3 .r{
	background: url(../images/bg_sec3_4.jpg) no-repeat;
	background-size: 100%;
	background-position: center;
}
#section02 .arrow2{
	margin: 8px auto;
}

@media (max-width: 1300px) {
	#section02 .bg-sec02{
		padding: 80px 0;
	}
	#section02 .h2ttl{line-height: 1; padding: 20px 0;}

}
@media (max-width: 1000px) {
	#section02 .bg-sec02{
		padding: 80px 0;
	}
	#section02 .h3ttl{
		font-size: 2.8vw;
	}
	#section02 .h3ttl2{
		font-size: 3vw;
		width: 90%;
		padding: 8px 0;
		margin: 50px auto 20px;
	}
	#section02 .h2ttl{font-size: 9vw}
	
	#section02 .day{
		width: 90%;
	}
	#section02 .day .l{
	}
	#section02 .day .l .num{
		background: #094567;
		color: #fff;
		padding: 16px 28px;
		position: absolute;
		top:16px;
		left: 0;
		text-align: center;
		font-size: 1.1rem;
	}
	#section02 .day .l .num span{
		font-size: 1.8rem;
	}
	#section02 .day .l .h3-day{
		font-size: 1.4rem;
		padding: 46px 20px 40px 110px;
	}
	#section02 .day .l .txt{
		margin: 0 20px 20px 30px;
		font-weight: 300;
	}
	#section02 .day .r{
		width: 200px;
		height: 100%;
		font-size: 1.4rem;
	}
	#section02 .day1 .r{
		background-size: 150%;
	}
	#section02 .day2 .r{
		background-size: 150%;
	}
	#section02 .day3 .r{
		background-size: 150%;
	}
	#section02 .arrow2{
		margin: 8px auto 3px;
	}
	
}

@media (max-width: 768px) {
	#section02 .day .l .txt{
		font-size: 0.9rem;
	}
	#section02 .bg-sec02{
		padding: 60px 0;
	}
	#section02 .h3ttl{font-size: 1.4rem; text-align: center;margin-top: 0;padding: 0 20px;}
	#section02 .txt02{
		margin-top: 30px;
		padding: 0 20px;
	}
	#section02 .h3ttl2{margin-top: 30px}
	#section02 .day .l .h3-day{
		padding: 30px 20px 20px 110px;
	}
	#section02 .flow{
		overflow: hidden;
	}
}

@media (max-width: 480px) {
	#section02 .h3ttl{
		font-size: 1.1rem; 
	}
	#section02 .h2ttl{font-size: 4rem;line-height: 1;}
	#section02 .h3ttl2{
		font-size: 1.1rem;
	}
	#section02 .day .l{
		display: block;
	}
	
	#section02 .day .l .num{
		padding: 10px 15px;
		position: absolute;
		top:10px;
		left: 0;
		font-size: 0.9rem;
	}
	#section02 .day .l .num span{
		font-size: 1.6rem;
	}
	#section02 .day .l .h3-day{
		font-size: 1.2rem;
		padding: 20px 15px 20px 70px;
	}
	#section02 .day .l .txt{
		margin: 0px 10px 20px 10px;
		font-size: 0.85rem;
	}

	
	#section02 .day .r{
		display: block;
		width: 100%;
		height: 140px;
	}
	#section02 .day1 .r{
		background-size: 100%;
	    background-position: center top 25%;
	}
	#section02 .day1 .r p{
		padding-top: 50px;
	}
	#section02 .day2 .r{
		background-size: 100%;
	    background-position: center top 20%;
	}
	#section02 .day2 .r p{
		padding-top: 40px;
	}
	#section02 .day3 .r{
		background-size: 100%;
	    background-position: center top 8%;
	}
	#section02 .day3 .r p{
		padding-top: 50px;
	}

}





/* section03
================================================== */
#section03{
	background-color: #fff;
	height: 800px;
	text-align: center;
}

#section03 .bg-sec03{
	background: url(../images/bg_sec3.jpg) no-repeat bottom;
	background-size:cover;
	width: 100%;
	padding: 80px 0;
	height: 800px;
	text-align: center;
}

#section03 .h3ttl{
	font-size: 2.2rem;
	margin: 30px auto;
	text-align: center;
}

#section03 .comingsoon{
	margin-top: 160px;
	font-size: 3.6rem;
	font-weight: 500;
}
@media (max-width: 1000px) {
	#section03 .comingsoon{
		margin-top: 180px;
		font-size: 2.6rem;
	}
}

@media (max-width: 768px) {
	#section03{
		height: 600px;
	}
	#section03 .bg-sec03{
		width: 100%;
		padding: 60px 0;
		height: 600px;
		text-align: center;
	}
	#section03 .comingsoon{
		margin-top: 100px;
		font-size: 2.2rem;
	}
}
@media (max-width: 480px) {
	#section03{
		height: 500px;
	}
	#section03 .bg-sec03{
		height: 500px;
		padding: 40px 0;
	}
	#section03 .h3ttl{
		font-size: 1.6rem;
		padding: 0 20px;
	}
	#section03 .comingsoon{
		margin-top: 120px;
		font-size: 1.8rem;
	}
}

/* section04
================================================== */
#section04{
	background-color: #fff;
	text-align: center;
	padding: 80px 0;
}

#section04 .h3ttl{
	font-size: 2.0rem;
	margin: 30px auto;
	text-align: center;
}

.tableArea {
  width: 960px;
  margin: 40px auto; }
  .tableArea table {
    width: 100%;
    table-layout: fixed; }
    .tableArea table tr th {
      border-top: #bebebe solid 1px;
      border-bottom: #bebebe solid 1px;
      font-weight: bold;
      padding: 30px 0;
      word-break: break-all;
      line-height: 1.8;
      text-align: left;
      width: 28%;
		color:#094567;}
    .tableArea table tr td {
      border-top: #bebebe solid 1px;
      border-bottom: #bebebe solid 1px;
      padding: 30px;
      text-align: left;
      word-break: break-all;
      width: 72%;
      line-height: 1.8; }

@media (max-width: 1300px) {
}
@media (max-width: 1000px) {
	.tableArea {
		width: 90%;
		margin-top: 10px;
	}
	.tableArea table tr th, .tableArea table tr td {
		width: 100%;
		display: block;
		padding: 10px 0;
		border-top: none;
	}
		.tableArea table tr td {
		border-bottom: none;
			margin-bottom: 20px;
	} 
}

@media (max-width: 768px) {
	#section04 .h3ttl{
		font-size: 1.6rem;
		padding: 0 20px;
	}
	#section04{
		padding: 60px 0;
	}
}
@media (max-width: 480px) {
	.tableArea {
		font-size: 0.85rem;
	}
	#section04{
		padding: 60px 0 0;
	}
	#section04 .h3ttl{
		font-size: 1.4rem;
	}
}


/* section05
================================================== */
#section05{
	background-color: #2f2d33;
	text-align: center;
	padding: 80px 0;
}
#section05 .h3ttl{
	font-size: 2.0rem;
	margin: 30px auto;
	text-align: center;
}

/*   アコーディオン    */
.faq-list{
	width: 960px;
	margin: 40px auto 0;	
	text-align: center;
}
.btn-3{
    background: #fff;
	text-align: left;
	display: table;
	padding: 0;
	width: 100%;
	position: relative;
	margin-bottom: 20px;
}
.btn-3 p.txt-q{
	display: table-cell;
	background: #094567;
	color:#fff;
	text-align: center;
	vertical-align: middle;
	width: 60px;
	height: 100%;
	margin: 0;
	padding: 20px 10px;
	font-size: 1.8rem;
}
.btn-3 h3{
	display: table-cell;
	font-size: 1.0rem;
	font-weight: 300;
	vertical-align: middle;
	padding-left: 20px;
	text-align: left;
}
h3.open_h3{
    cursor: pointer;
    margin: 0;
}
.faq-list .info{
	color: #fff;
	margin: 0;
	font-size: 1.0rem;
	text-align: left;
}
.btn-3.active::after {
  content: "\f3d8";
}
.btn-3::after {
  content: "\f3d0";
  font-family: ionicons;
  position: absolute;
  top: 30%;
  right: 15px;
  font-size: 1.8rem;
  color: #094567;

}

@media (max-width: 1300px) {
}
@media (max-width: 1000px) {
	.faq-list{
		width: 90%;
		margin: 40px auto 0;	
		text-align: center;
	}
	.btn-3{
		margin-bottom: 20px;
	}
	.btn-3 p.txt-q{
		padding: 20px 10px;
		font-size: 1.5rem;
	}
	.btn-3 h3{
		font-size: 1.0rem;
	}
	.faq-list .info{
		color: #fff;
		margin: 0;
		font-size: 1.0rem;
		text-align: left;
	}
	.btn-3.active::after {
	  content: "\f3d8";
	}
	.btn-3::after {
	  content: "\f3d0";
	  font-family: ionicons;
	  position: absolute;
	  top: 30%;
	  right: 10px;
	  font-size: 1.8rem;
	  color: #094567;

	}
}
@media (max-width: 768px) {
	#section05 .h3ttl{
		font-size: 1.6rem;
		padding: 0 20px;
	}
	#section05{
		padding: 60px 0;
	}
	.btn-3 h3{
		padding-right: 34px;
	}
	.btn-3 p.txt-q{
		width: 48px;
	}
	.txt-faq{padding: 0 20px;}
}
@media (max-width: 480px) {
	.faq-list{
		margin-top: 30px;
	}
	#section05 .h3ttl{
		font-size: 1.4rem;
	}
	.btn-3 p.txt-q{
		width: 40px;
	}
	.btn-3 p.txt-q{
		padding: 15px 10px;
		font-size: 1.3rem;
	}
	.btn-3 h3{
		font-size: 0.85rem;
	}
	.btn-3::after {
	  top: 20%;
	}
}



/* Footer
================================================== */

.btnArea{
	width: 100%;
	background: #fff;
	text-align: center;
	padding: 40px 0 50px;
}
.btnArea .button{
	background: #094567;
	width: 700px;
	margin: 0 auto;
}
.btnArea .button a{
	font-size:1.8rem;
	display: block;
	color:#fff;
	background-color: #094567;
	padding: 24px;
	width: 100%;;
	transition: all 300ms;
}
.btnArea .button a:hover{
	background-color:#5692b6;
}


.button2 {
	margin : 0 auto;
	margin-top : 10px;
	width : 700px;
	height : 90px;
	background : #094567;
	overflow : hidden;
	text-align : center;
	cursor : pointer;
	transition : .2s;
}
.button2 a{
	padding-top:26px; 
	color:#fff;
	font-size:1.8rem;
	display: block;
}
.button2:hover{
	background:#4087b0;
	transition : .2s;
}

footer{
	background: #fff;
	display: table;
	width: 100%;
	padding: 0 0 40px;
}
footer .wrap{
	width: 700px;
	margin: 0 auto;
}
footer .wrap .l{
	display: table-cell;
	vertical-align: middle;
	width: 50%;
}
footer .wrap .r{
	display: table-cell;
	vertical-align: middle;
	text-align: left
}
footer .wrap .r .ttl{
	margin-bottom: 10px;
	font-size: 1.1rem;
}
footer .wrap .r .name{
	font-size: 1.2rem;
}
footer .wrap .r p{
	margin-bottom: 20px;
}
footer .wrap .r a{
	color: #094567;
	background-color: #fff;
	padding: 6px 20px 8px;
	border: solid 1px #094567;
	transition : .2s;
}
footer .wrap .r a:hover{
	color: #fff;
	background-color: #094567;
}

@media (max-width: 768px) {
	.button2 {
		margin : 0 auto;
		margin-top : 10px;
		width : 80%;
		height : 90px;
		background : #094567;
		overflow : hidden;
		text-align : center;
		cursor : pointer;
	}
	.button2 a{
		padding-top:30px; 
		color:#fff;
		font-size:1.6rem;
		display: block;
	}
	.button2:hover{
		background:#094567;
	}
	footer .wrap{
		width: 90%;
		margin: 0 auto;
	}
	footer .wrap .r p{
		font-size: 0.9rem;
	}
	footer .wrap .r .ttl{
		font-size: 1.0rem;
	}
	footer .wrap .r .name{
		font-size: 1.1rem;
	}
}
@media (max-width: 480px) {
	.button2 {
		width : 90%;
	}
	footer .wrap .l{
		display: block;
		width: 90%;
		text-align: center;
		margin: 0 auto;
	}
	footer .wrap .r{
		display: block;
		width: 90%;
		text-align: center;
		margin: 0 auto;
	}
	footer .wrap .r p{
		font-size: 0.85rem;
	}
}


@media (max-width: 1300px) {
}
@media (max-width: 1000px) {
}
@media (max-width: 768px) {
}
@media (max-width: 480px) {
}




/* ##### Anime ##### */
.anim {
  opacity: 0;
  transform: translate(0, 50px) scale(0.9, 0.9);
  transition: all 600ms;
}
.anim-r {
  opacity: 0;
  transform: scale(0.7, 0.7);
  transition: all 600ms;
}
.anim1, .anim2, .anim3 {
  opacity: 0; }

/* 画面内に入った状態 */
.anim.scrollin {
  opacity: 1;
  transform: translate(0, 0) scale(1, 1); 
}
.anim-r.scrollin {
  opacity: 1;
  transform: scale(1, 1);
}
.pr { position: relative; }



/* =========================================================
IE,EDGE,FireFox
========================================================= */
/* FireFox */
@-moz-document url-prefix() {
	#sidebar .nav > ul > li {
		padding: 0 20px 0 0;
		line-height: 4.8;
		height: 76px;
	}
	#sidebar .nav > ul > li > a{
		padding-top: 0;
	}
	#sidebar .nav > ul > li.login{
		padding-top: 0;
		line-height: 5.4;
	}
	#sidebar .nav > ul > li.entry{
		padding-top: 0;
		line-height: 5.4;
	}
	#sidebar .nav > ul > li.login a.mover{
		margin-top: -4px;
		height: 84px;
	}
	#sidebar .nav > ul > li.entry a.mover{
		margin-top: -4px;
		height: 84px;
	}
	@media (max-width: 1100px) {
		#sidebar-sp .nav > ul > li,#sidebar-sp .nav > ul > li.login a.mover,#sidebar-sp .nav > ul > li.entry a.mover{
		height: auto;
			line-height: 2;
	}
		#sidebar-sp .nav > ul > li.uline{
			padding: 0;
		}
		.nav > ul > li.login,.nav > ul > li.entry{
			padding-top: 10px !important;
		}
	}
}

/* IE */
@media all and (-ms-high-contrast:none){
	#sidebar .nav > ul > li {
		line-height: 4.4;
	}
	#sidebar .nav > ul > li.btn_c {
		padding: 10px 20px 2px 0;
		height: 60px;
		line-height: 4.0;
	}
	#sidebar .nav > ul > li.uline {
		padding: 6px 20px 2px 0;
		height: 60px;		
	}

	#sidebar .nav > ul > li > a{
		padding-top: 0;
	}
	.big-background .big-background-container .mv_scr{
		left:50%
	}
	#section01 .ie{display: block;text-align: left;padding-bottom:30px;}
	#section02 .ie{display: block;text-align: center; padding-top: 20px;}
	.noie{display: none;}
}
/*@media all and (-ms-high-contrast:none),(max-width: 1100px) {
	#sidebar .nav > ul > li.uline{
		padding-top: 10px!important;
		height: auto;
	}
	#sidebar .nav > ul > li,#sidebar .nav > ul > li.login a.mover,#sidebar .nav > ul > li.entry a.mover{
		height: auto;
		line-height: 2;
	}
	#sidebar .nav > ul > li.uline{
		padding: 0;
	}
	.nav > ul > li.login,.nav > ul > li.entry{
		padding-top: 10px !important;
	}

}
*/
/* EDGE */
@supports (-ms-ime-align: auto) {
	#sidebar .nav > ul > li {
		line-height: 4.4;
	}
	#sidebar .nav > ul > li.btn_c {
		padding: 10px 20px 2px 0;
		height: 60px;
		line-height: 4.0;
	}
	#sidebar .nav > ul > li.uline {
		padding: 6px 20px 2px 0;
		height: 60px;		
	}

	#sidebar .nav > ul > li > a{
		padding-top: 0;
	}
	#section01 .ie{display: block;text-align: left;padding-bottom:30px;}
	#section02 .ie{display: block;text-align: center; padding-top: 20px;}
	.noie{display: none;}
	
	@media (max-width: 1100px) {
		#sidebar-sp .nav > ul > li.uline{
			padding-top: 10px!important;
			height: auto;
		}
		#sidebar-sp .nav > ul > li,#sidebar-sp .nav > ul > li.login a.mover,#sidebar-sp .nav > ul > li.entry a.mover{
			height: auto;
			line-height: 2;
		}
		#sidebar-sp .nav > ul > li.uline{
			padding: 0;
		}
		.nav > ul > li.login,.nav > ul > li.entry{
			padding-top: 10px !important;
		}

	}
}

