@charset "utf-8";

* {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
}
html {
	font: 0px/1 "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ヒラギノ明朝 Pro W3","Hiragino Mincho Pro", "ＭＳ Ｐゴシック", "MS PGothic", "メイリオ", Meiryo, sans-serif;
	width: 100%;
	height: 100%;
}
body {
	width: 100%;
	height: 100%;
	color: #666;
	background: #fff;
	overflow: hidden;
}

@media screen and (max-width: 1267px) {
  body {overflow-x: scroll;}
}
@media screen and (max-height: 660px) {
  body {overflow-y: scroll;}
}

#container {
	position: relative;
	z-index: 1;
	width: 100%;
	min-width: 1280px;
	height: 620px;
	text-align: center;
	color: inherit;
	background: #d5f7ff url(../img/bg_body.png) left bottom repeat-x;
	overflow: hidden;
}
#container > *,
#container > * > * {
	position: absolute;
}
li,
button {
	cursor: pointer;
}
img {
	vertical-align: top;
}





/* header
----------------------------------------------------------------------*/
header {
	z-index: 7000;
	bottom: 102px;
	left: 50%;
	width: 507px;
	height: 416px;
	margin-left: -253px;
}
header h1 {
	z-index: 7010;
	top: 0;
	left: 0;
	width: 375px;
	opacity: 0;
}
header p {
	z-index: 7020;
	top: 75px;
	left: 0;
	width: 0;
	overflow: hidden;
}
header p img {
	width: 507px;
}
header button {
	z-index: 7030;
	top: 360px;
	left: 50%;
	width: 32px;
	margin-left: -28px;
	padding: 12px;
	opacity: 1;
	border-radius: 50%;
	color: inherit;
	background: #d70c18;
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: 500ms cubic-bezier(0.680, -0.550, 0.265, 1.550);
	transition: 500ms cubic-bezier(0.680, -0.550, 0.265, 1.550);
}
header button.deactive {
	opacity: 0;
	-webkit-transform: scale(1.5);
	transform: scale(1.5);
	-webkit-transition: 250ms;
	transition: 250ms;
}
header button.deactive {
	opacity: 1\9;
}
:root .header button.deactive {
	opacity: 1\0/;
}
header button:hover {
	-webkit-transform: scale(1.25);
	transform: scale(1.25);
	-webkit-transition: 125ms;
	transition: 125ms;
}





/* article
----------------------------------------------------------------------*/
article {
	z-index: 1500;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	opacity: 0;
	overflow: hidden;
	-webkit-transform: translateZ(0px);
}
article + article {
	left: 100%;
}
article h2 {
	z-index: 4000;
	width: 173px;
	bottom: 570px;
	left: 50%;
	margin-left: -605px;
}
article > button {
	z-index: 4020;
	bottom: 360px;
	min-height: 145px;
	padding: 16px;
	color: inherit;
	background: #d70c18;
	-webkit-transition: 250ms;
	transition: 250ms;
}
article > button img {
	width: 18px;
}
article .to_overseas {
	right: -26px;
	padding-right: 42px;
}
article .to_overseas:hover {
	-webkit-transform: translateX(-20px);
	transform: translateX(-20px);
}
article .to_domestic {
	left: -26px;
	padding-left: 42px;
}
article .to_domestic:hover {
	-webkit-transform: translateX(20px);
	transform: translateX(20px);
}

/* フキダシ */
.balloon {
	z-index: 4010;
	width: 100%;
	height: 100%;
	top: 40px;
	left: 0;
}
.balloon li {
	position: absolute;
	left: 50%;
	width: 108px;
	-webkit-transform: translateZ(0px);
	-webkit-animation-name: balloon;
	-webkit-animation-duration: 1s;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-direction: alternate;
	animation-name: balloon;
	animation-duration: 1s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
}
.balloon .d01 {
	z-index: 4210;
	bottom: 182px;
	margin-left: -629px;
	-webkit-animation-delay: 0s;
	animation-delay: 0s;
}
.balloon .d02 {
	z-index: 4220;
	bottom: 268px;
	margin-left: 179px;
	-webkit-animation-delay: 300ms;
	animation-delay: 300ms;
}
.balloon .d03 {
	z-index: 4230;
	bottom: 185px;
	margin-left: 507px;
	-webkit-animation-delay: 500ms;
	animation-delay: 500ms;
}
.balloon .d04 {
	z-index: 4240;
	bottom: 295px;
	margin-left: -56px;
	-webkit-animation-delay: 700ms;
	animation-delay: 700ms;
}
.balloon .d05 {
	z-index: 4250;
	bottom: 210px;
	margin-left: -308px;
	-webkit-animation-delay: 1100ms;
	animation-delay: 1100ms;
}
.balloon .d06 {
	z-index: 4260;
	bottom: 393px;
	margin-left: -450px;
	-webkit-animation-delay: 1300ms;
	animation-delay: 1300ms;
}
.balloon .o01 {
	z-index: 4310;
	bottom: 458px;
	margin-left: 265px;
	-webkit-animation-delay: 0s;
	animation-delay: 0s;
}
.balloon .o02 {
	z-index: 4320;
	bottom: 359px;
	margin-left: -160px;
	-webkit-animation-delay: 300ms;
	animation-delay: 300ms;
}
.balloon .o03 {
	z-index: 4330;
	bottom: 215px;
	margin-left: -556px;
	-webkit-animation-delay: 500ms;
	animation-delay: 500ms;
}
.balloon .o04 {
	z-index: 4340;
	bottom: 294px;
	margin-left: 447px;
	-webkit-animation-delay: 700ms;
	animation-delay: 700ms;
}
.balloon .o05 {
	z-index: 4350;
	bottom: 422px;
	margin-left: -393px;
	-webkit-animation-delay: 1100ms;
	animation-delay: 1100ms;
}
.balloon .o06 {
	z-index: 4360;
	bottom: 255px;
	margin-left: 101px;
	-webkit-animation-delay: 1300ms;
	animation-delay: 1300ms;
}
@-webkit-keyframes balloon {
	0% {-webkit-transform: translateY(0);}
	100% {-webkit-transform: translateY(-4px);}
}
@keyframes balloon {
	0% {transform: translateY(0);}
	100% {transform: translateY(-4px);}
}
.balloon li:hover,
.balloon li.active {
	-webkit-animation-play-state: paused;
	animation-play-state: paused;
}
.balloon li img {
	-webkit-transform-origin: center bottom;
	transform-origin: center bottom;
	-webkit-transform: translateZ(0px);
	-webkit-transition: 250ms cubic-bezier(0.680, -0.550, 0.265, 1.550);
	transition: 250ms cubic-bezier(0.680, -0.550, 0.265, 1.550);
}
.balloon li:hover img,
.balloon li.active img {
	-webkit-transform: scale(1.25);
	transform: scale(1.25);
}

/* 背景等 */
article > img {
	left: 50%;
}
article .background {
	z-index: 1010;
	bottom: -40px;
	width: 2700px;
	margin-left: -1350px;
}
.img_domestic_01 {
	z-index: 2900;
	width: 80px;
	bottom: 266px;
	margin-left: -544px;
}
.img_domestic_02 {
	z-index: 2100;
	width: 547px;
	bottom: 177px;
	margin-left: -626px;
}
.img_domestic_03  {
	z-index: 2100;
	width: 1500px;
	bottom: 334px;
	margin-left: 152px;
}
.img_domestic_04 {
	z-index: 2100;
	width: 319px;
	bottom: 71px;
	margin-left: 287px;
}
.img_domestic_05 {
	z-index: 2800;
	width: 49px;
	bottom: 69px;
	margin-left: -12px;
}
.img_overseas {
	z-index: 3010;
	width: 1158px;
	bottom: 92px;
	margin-left: -407px;
}





/* section
----------------------------------------------------------------------*/
article > section {
	z-index: 6000;
	bottom: 40px;
	left: 50%;
	width: 1215px;
	height: 580px;
	margin-left: -607px;
	color: #000;
	background: #fff;
	text-align: left;
	box-shadow: 0 0 10px rgba(0,0,0,.5);
	display: none;
	opacity: 0;
	-webkit-transform: translateZ(0px);
	-webkit-transform: translateY(20px);
	transform: translateY(20px);
	-webkit-transition: 500ms;
	transition: 500ms;
}
article > section.active {
	opacity: 1;
	-webkit-transform: translateY(0);
	transform: translateY(0);
}
article > section > * {
	position: absolute;
}
section > figure {
	z-index: 6010;
	top: 20px;
	left: 20px;
	width: 617px;
	height: 540px;
	overflow: hidden;
}
section h3 {
	z-index: 6020;
	top: 100px;
	left: 687px;
	width: 350px;
	border-left: solid 3px #d70c18;
	padding-left: 15px;
}
section section {
	z-index: 6030;
	bottom: 50px;
	right: 50px;
	width: 478px;
}
section h4 {
	font: 18px/1.44 "ヒラギノ角ゴ ProN W6", "HiraKakuProN-W6", "ヒラギノ角ゴ Pro W6", "HiraKakuPro-W6", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ヒラギノ明朝 Pro W3","Hiragino Mincho Pro", "ＭＳ Ｐゴシック", "MS PGothic", "メイリオ", Meiryo, sans-serif;
	font-weight: bold;
	margin-bottom: 20px;
}
section p {
	font-size: 14px;
	line-height: 2;
	letter-spacing: -.03em;
	text-align: justify;
}
section button {
	z-index: 6040;
	top: 10px;
	right: 10px;
	width: 30px;
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: 250ms;
	transition: 250ms;
}
section button:hover {
	-webkit-transform: scale(1.25);
	transform: scale(1.25);
}
.mask {
	z-index: 5000;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	color: inherit;
	background: rgba(255,255,255,.5);
	cursor: pointer;
	display: none;
}





/* #menu
----------------------------------------------------------------------*/
#menu {
	z-index: 9000;
	bottom: 0;
	left: 50%;
	width: 80px;
	height: 40px;
	margin-left: 535px;
	color: inherit;
	background: #000;
	-webkit-transform: translateZ(0px);
	-webkit-transition: 500ms;
	transition: 500ms;
}
#menu.active {
	bottom: 150px;
}
#menu.deactive {
	bottom: -41px;
}
#menu img {
	z-index: 9010;
	top: 14px;
	left: 18px;
	width: 43px;
}





/* nav
----------------------------------------------------------------------*/
nav {
	z-index: 8000;
	bottom: -190px;
	width: 100%;
	height: 190px;
	color: inherit;
	background: rgba(255,255,255,.9);
	-webkit-transform: translateZ(0px);
	-webkit-transition: 500ms;
	transition: 500ms;
}
nav.active {
	bottom: 0;
}
nav div {
	z-index: 8010;
	top: 20px;
	left: 50%;
	width: 599px;
	height: 140px;
	text-align: left;
	padding: 10px 0 0 75px;
}
nav div:first-child {
	margin-left: -675px;
	border-right: solid 2px #606875;
}
nav button {
	margin-bottom: 25px;
}
nav button i {
	display: inline-block;
	margin-top: 2px;
}
nav button:hover i {
	-webkit-animation: arrow 250ms;
	animation: arrow 250ms;
}
@-webkit-keyframes arrow {
	0% {-webkit-transform: translateX(-15px);}
	100% {-webkit-transform: translateX(0);}
}
@keyframes arrow {
	0% {transform: translateX(-15px);}
	100% {transform: translateX(0);}
}
nav button i img {
	width: 12px;
	margin-right: 8px;
}
nav button > img {
	width: 144px;
}
nav li {
	display: inline-block;
	margin-bottom: 18px;
	overflow: hidden;
	width: 270px;
	height: 16px;
}
nav li i {
	display: inline-block;
	height: 14px;
	border-right: solid 2px #d70c18;
	margin-right: 8px;
	padding: 2px 8px 0 0;
}
nav li i img {
	width: 18px;
}
nav li > img {
	width: 220px;
	-webkit-transform: translateY(0);
	transform: translateY(0);
	-webkit-transition: 250ms;
	transition: 250ms;
}
nav li > img.active {
	-webkit-transform: translateY(-24px);
	transform: translateY(-24px);
}





/* footer
----------------------------------------------------------------------*/
footer {
	width: 1280px;
	height: 40px;
	margin: 0 auto;
}
footer > * {
	opacity: 0;
	-webkit-transition: 2s;
	transition: 2s;
}
footer .active {
	opacity: 1;
}
footer img {
	float: left;
	width: 460px;
	margin: 10px 0 0 20px;
}
footer p {
	float: right;
	font-size: 9px;
	margin: 17px 20px 0 0;
}
footer b {
	margin: 0 .5em;
}




/* 20151204 style overwrite */

article .background {
	width: 3206px;
	margin-left: -1603px;

}

.bg_domestic_repeat_l,.bg_domestic_repeat_r,
.bg_overseas_repeat_l,.bg_overseas_repeat_r {
  width: 50%;
  height: 660px;
  background-repeat:repeat-x;
  background-size: contain;
  position: absolute !important;
  bottom: -40px;
}

.bg_domestic_repeat_l {
	background-image:url(../img/bg_domestic_repeat_l.png);
	left:0;
}

.bg_domestic_repeat_r {
	background-image:url(../img/bg_domestic_repeat_r.png);
	right:0;
}

.bg_overseas_repeat_l {
	background-image:url(../img/bg_overseas_repeat_l.png);
	left:0;
}

.bg_overseas_repeat_r {
	background-image:url(../img/bg_overseas_repeat_r.png);
	right:0;
}