@charset "UTF-8";

canvas,iframe,img,select,svg,textarea,video{max-width:100%}.overflow-container{overflow-y:scroll}
.aspect-ratio{height:0;padding-top:56.25%;position:relative}
.aspect-ratio--object{height:100%;position:absolute;top:0;right:0;bottom:0;left:0;width:100%;z-index:100}

* {box-sizing: border-box;}
body {line-height: 2; text-align: center;}

#home {text-align: right; margin:0; line-height: 0;}
#home a {padding: 30px; display: inline-block;}
#home a img {width: 100px;}

article {margin: 0 auto;}
ul {list-style: none;}
img {vertical-align: bottom;}
h1 {margin: 0; font-family: Helvetica, sans-serif; font-size: 2.5em; line-height: 1.5;}

.lead, p {margin: 0 auto;}
.lead, .desc {font-family: serif; max-width: 800px; margin: 20px auto 0; text-align: left;}
.ua-windows_nt .lead, .ua-windows_nt .desc {font-family: sans-serif;}

.youtube {position: relative; width:100%; margin: 0 3% 3% 0; vertical-align: top; padding-top:56.25%;}
.youtube iframe {position:absolute; top: 0; right: 0; width: 100%; height: 100%;}
video {width: 100%; height: auto; background: transparent url(/jp/narita-terminal3/img/poster.jpg) no-repeat 0 0; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}

header {text-align: left; overflow: hidden;}
article header h1 {margin: 0; font-size: 16px; text-align: left; padding: 30px 20px; display: inline-block; width: 50%;}
#home {width: auto; float: right;}
article .lead {margin-bottom: 40px; font-size: 16px;}
article hr {border:solid #777; border-width:1px 0 0 0; width: 50%; margin: 40px auto;}

.viewport {position: relative; width: 90%; margin: 0 auto;}
.viewport img {width: 100%; max-width: 1500px;}
.viewport:first-child {margin-bottom: 40px;}

#airportImg {width: 100%; background: #f7f7f7; padding-top: 40px;}
#airportImg img {margin-bottom: 40px;}

#bench {margin-top: 80px; width: 100%;}
#bench h1 {margin: 0 0 20px; font-size: 1.5em;}
#bench .viewport {width: 80%; max-width: 800px; border: 1px solid #ddd; padding: 30px; box-sizing: border-box; border-radius: 8px; }
#bench .viewport img {width: 100%;}

.relatedLink {display: block; text-align: right; margin-top: 20px;}
.relatedLink a {display: inline-block; background: url(/img/common/arrow_right.png) no-repeat 14px 50%; border: 1px solid #ccc; padding: 10px 20px 10px 35px; text-decoration: none;}
.relatedLink a:hover {border: 1px solid #191919;}

header:after {
  content: "";
  clear: both;
  display: block;
}

.youtube,
.vid_mobile {display: none;}

.ua-ie-8 .youtube,
.ua-ie-9 .youtube {display: block;}

.ua-mobile .vid_mobile {display: block;}

.ua-mobile #vid,
.ua-ie-8 #vid, 
.ua-ie-9 #vid {display: none;}
.ua-ie-8 #home a {display: block; width: 200px;}




aside.share {border: none; text-align: center; margin-top: 0; background: #fff; padding: 40px 0;}
aside.share a {display: inline-block; margin-right: 20px;}
aside.share a:last-child {margin-right: 0;}
aside.share span {display: inline-block; margin-right: 20px; color: #999; font-size: small;}
aside.share img {vertical-align: bottom;}

footer {background: #fff;}
footer p {font-size: 13px; color: #333; margin: 0; padding: 10px 0;}

@media only screen and (max-width : 768px){
	body {line-height: 1.6;}
	#bench .viewport {width: 90%; padding: 15px;}
	.lead, p {width: 95%; margin: 20px auto 0;}
	.relatedLink a {font-size: 14px;}
	#bench h1 {font-size: 1.3em;}
}
