/* tbs.common.css Rev 2015-11-27 */

html{ height:100%; }
body{ height:100%; margin:0; padding:0; position:relative; background:#fff; }

.tbs div, .tbs p, .tbs img, header, footer{ box-sizing:border-box; }
.tbs div{ position:relative; }

/* Temporary Image */
.tbs div.x{ overflow:hidden; border:1px solid #ddd; box-sizing:border-box; position:relative; background-color:#eaeaea; color:#777; text-align:center; line-height:1.5em; font-size:8pt; }

/* =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
	Global Attr
*/
	.tbs h1{ margin:20px 0 0 0; padding:2px 0 0 0; font-size:18pt; line-height:1.3em; color:#555; font-weight:normal; }
	.tbs h2{ margin:20px 0 0 0; padding:2px 0 0 0; font-size:15pt; line-height:1.3em; color:#555; font-weight:normal; }

	.tbs .x-encap{ margin:0; padding:0; overflow:hidden; position:relative; }
	.tbs .x-encap > *{ overflow:hidden; position:relative; margin:0; padding:0; font-size:19pt; line-height:1.3em; color:#4A84A7; font-weight:normal; max-width:49%; height:auto; }
	.tbs .x-encap h2{ float:left; }
	.tbs .x-encap h2 i{ color:#8BABBE; font-size:77%; }
	.tbs .x-encap .x-ja{ float:right; font-size:18pt; }


	.tbs p{ margin:10px 0 0 0; padding:0px 0 0 0; font-size:10.5pt; line-height:1.5em; color:#333; }
	.tbs p.doc-s{ font-size:9pt; }
	.tbs p.doc-ss{ font-size:8pt; }

	.tbs ol{ margin:10px 0 0 0; padding:0 0 0 0; vertical-align: baseline; list-style-type:decimal; list-style-position:inside; }
	.tbs ol.x-disc{ list-style-type:disc; }
	.tbs ol.x-circle{ list-style-type:circle; }
	.tbs ol > li{ display:list-item; padding:0; margin:5px 0 0 0; font-size:10.5pt; line-height:1.5em; color:#333; }
	.tbs ol > li:first-child{ margin-top:0; }

	.tbs h1.c-subpage-caption{ margin:30px 0 0 20px; padding:0; font-size:30px; line-height:1.2em; color:#fff; text-shadow:0 1px 3px rgba(0,0,0,.6); }
	.tbs p.c-subpage-caption{ margin:0 0 0 20px; padding:0;font-size:16px; line-height:1.2em; color:#fff; text-shadow:0 1px 3px rgba(0,0,0,.6); }

	.tbs ul.x-tblist > li{ float:none; overflow:hidden; margin:5px 0 0 0; }
	.tbs ul.x-tblist > li:first-child{ margin-top:0; }
	.tbs ul.x-tblist > li div.c{ display:inline-block; background:#D9E4ED; color:#3A4B59; padding:4px 6px; border-radius:3px; font-weight:bold; }
	.tbs ul.x-tblist > li div.v{ display:inline-block; background:transparent; color:#222; padding:4px 6px; }

/* =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
	Progress
*/
	.tbs .c-prog{
		pointer-events:none; position:absolute; top:50%; left:50%; right:0; bottom:0; margin:-40px 0 0 -40px; width:80px; height:80px;
		background:transparent url(/imgs/prog01.png) no-repeat center center;
		-webkit-animation: k-c-prog .8s steps(10, end) infinite;
		-moz-animation: k-c-prog .8s steps(10, end) infinite;
		animation: k-c-prog .8s steps(10, end) infinite;
	}
	@-webkit-keyframes k-c-prog {
	    from { background-position: 0px; }
	    to { background-position: -800px; }
	}
	@-moz-keyframes k-c-prog {
	    from { background-position: 0px; }
	    to { background-position: -800px; }
	}
	@keyframes k-c-prog {
	    from { background-position: 0px; }
	    to { background-position: -800px; }
	}


/* =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
	Sprite
*/
	.tbs .c-icn{ background-image:url(/imgs/c_iconset.png); background-repeat:no-repeat; background-size:100px 500px; }
	.tbs .c-icn[data-icn-scale="s"]{ transform:scale(0.6); margin:-10px ! important; }

	.tbs .c-icn-paint{ width:50px; height:50px; background-position:0px 0px; }
	.tbs .c-icn-beach{ width:50px; height:50px; background-position:0px -50px; }
	.tbs .c-icn-museum{ width:50px; height:50px; background-position:0px -100px; }
	.tbs .c-icn-park{ width:50px; height:50px; background-position:0px -150px; }
	.tbs .c-icn-binocular{ width:50px; height:50px; background-position:0px -200px; }
	.tbs .c-icn-bridge{ width:50px; height:50px; background-position:0px -250px; }
	.tbs .c-icn-touristspot{ width:50px; height:50px; background-position:0px -300px; }
	.tbs .c-icn-camera{ width:50px; height:50px; background-position:0px -350px; }
	.tbs .c-icn-shine{ width:50px; height:50px; background-position:0px -400px; }
	.tbs .c-icn-carspot{ width:50px; height:50px; background-position:0px -450px; }

	.tbs .c-icn-c-paint{ width:50px; height:50px; background-position:-50px 0px; }
	.tbs .c-icn-c-beach{ width:50px; height:50px; background-position:-50px -50px; }
	.tbs .c-icn-c-museum{ width:50px; height:50px; background-position:-50px -100px; }
	.tbs .c-icn-c-park{ width:50px; height:50px; background-position:-50px -150px; }
	.tbs .c-icn-c-binocular{ width:50px; height:50px; background-position:-50px -200px; }
	.tbs .c-icn-c-bridge{ width:50px; height:50px; background-position:-50px -250px; }
	.tbs .c-icn-c-touristspot{ width:50px; height:50px; background-position:-50px -300px; }
	.tbs .c-icn-c-camera{ width:50px; height:50px; background-position:-50px -350px; }
	.tbs .c-icn-c-shine{ width:50px; height:50px; background-position:-50px -400px; }
	.tbs .c-icn-c-carspot{ width:50px; height:50px; background-position:-50px -450px; }

/* =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
	Buttons
*/
	.tbs .c-link{
		display:inline-block;
		cursor:pointer; border-width:1px; border-style:solid; border-color:#cbeef8 #025269 #025269 #cbeef8; background:#0a7999 url(/imgs/c_link.png) no-repeat right center; background-size:30px 30px;
		border-radius:7px; padding:0 35px 0 15px; height:32px; line-height:32px; font-size:10pt; color:#fff; text-decoration:none;
	}
	@media screen and (max-width:999px){
		.tbs .c-link{ padding:0 30px 0 10px; font-size:9pt; }
	}

/* =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
	Header
*/
	.tbs .c-head{ z-index:100; overflow:visible; pointer-events:none; position:fixed; top:0; left:0; right:0; bottom:auto; width:100%; height:100px; }
	.tbs .c-head header{ z-index:100; overflow:visible; position:relative; width:100%; height:70px; background:#fff url(/imgs/c_header_back.png) repeat-x left top; box-shadow:0 0 8px rgba(0,0,0,.5); }
	.tbs .c-head header > .x-bs{ overflow:visible; position:relative; width:1000px; height:70px; margin:0 auto 0 auto; background:transparent url(/imgs/c_header_02.png) no-repeat 230px 0px; }
	.tbs .c-head header > .x-bs .x-logo{ z-index:2; position:absolute; top:0; left:0; width:230px; height:70px; background:transparent url(/imgs/c_header_01.png) no-repeat left center; pointer-events:auto; }
	.tbs .c-head header > .x-bs .x-lang{ z-index:2; position:absolute; width:129px; height:22px; top:0; left:auto; right:0; bottom:auto; background:transparent url(/imgs/c_header_03.png) no-repeat center center; pointer-events:auto; }

	.tbs[data-page-lang="en"] .c-head header > .x-bs .x-lang{ background-image:url(/imgs/c_header.en_03.png); }

	@media screen and (max-width:999px){
		.tbs .c-head{ height:50px; }
		.tbs .c-head header{ height:40px; box-shadow:0 0 8px rgba(0,0,0,.5); background-image:none; }
		.tbs .c-head header > .x-bs{ width:100%; height:40px; background-image:none; }
		.tbs .c-head header > .x-bs .x-logo{ width:295px; height:38px; background-image:url(/imgs/c_headerlogo_mob.png); background-size:295px 38px; }
		.tbs .c-head header > .x-bs .x-lang{ z-index:2; position:absolute; width:129px; height:22px; top:0; left:auto; right:0; bottom:auto; background:transparent url(/imgs/c_header_03.png) no-repeat center center; pointer-events:auto; }
	}

	.tbs .c-head .x-menu{ z-index:2; position:absolute; width:533px; height:48px; top:auto; left:auto; right:0; bottom:0; }
	.tbs .c-head .x-menu ul{ width:100%; height:100%; margin:0; }
	.tbs .c-head .x-menu ul > li{ float:left; margin:0; width:auto; overflow:hidden; position:relative; }
	.tbs .c-head .x-menu li > a{ pointer-events:auto; display:block; margin:0; padding:0; color:rgba(0,0,0,0); text-indent:-9999em; font-size:7pt; }
	.tbs .c-head .x-menu li > a.x-menu1{ background:transparent url(/imgs/c_header_05.png) no-repeat center center; width:120px; height:48px; background-size:contain; }
	.tbs .c-head .x-menu li > a.x-menu2{ background:transparent url(/imgs/c_header_06.png) no-repeat center center; width:120px; height:48px; background-size:contain; }
	.tbs .c-head .x-menu li > a.x-menu3{ background:transparent url(/imgs/c_header_07.png) no-repeat center center; width:164px; height:48px; background-size:contain; }
	.tbs .c-head .x-menu li > a.x-menu4{ background:transparent url(/imgs/c_header_08.png) no-repeat center center; width:129px; height:48px; background-size:contain; }
	.tbs .c-head .x-menu li > a.x-menu1-h, .tbs .c-head .x-menu li.x-selected > a.x-menu1{ background-image:url(/imgs/c_header_on_05.png)!important; }
	.tbs .c-head .x-menu li > a.x-menu2-h, .tbs .c-head .x-menu li.x-selected > a.x-menu2{ background-image:url(/imgs/c_header_on_06.png)!important; }
	.tbs .c-head .x-menu li > a.x-menu3-h, .tbs .c-head .x-menu li.x-selected > a.x-menu3{ background-image:url(/imgs/c_header_on_07.png)!important; }
	.tbs .c-head .x-menu li > a.x-menu4-h, .tbs .c-head .x-menu li.x-selected > a.x-menu4{ background-image:url(/imgs/c_header_on_08.png)!important; }

	.tbs .c-head .x-menu li > a.x-menu1-en{ background:transparent url(/imgs/c_header.en_05.png) no-repeat center center; width:120px; height:48px; background-size:contain; }
	.tbs .c-head .x-menu li > a.x-menu2-en{ background:transparent url(/imgs/c_header.en_06.png) no-repeat center center; width:120px; height:48px; background-size:contain; }
	.tbs .c-head .x-menu li > a.x-menu3-en{ background:transparent url(/imgs/c_header.en_07.png) no-repeat center center; width:164px; height:48px; background-size:contain; }
	.tbs .c-head .x-menu li > a.x-menu4-en{ background:transparent url(/imgs/c_header.en_08.png) no-repeat center center; width:129px; height:48px; background-size:contain; }
	.tbs .c-head .x-menu li > a.x-menu1-h-en, .tbs .c-head .x-menu li.x-selected > a.x-menu1-en{ background-image:url(/imgs/c_header_on.en_05.png)!important; }
	.tbs .c-head .x-menu li > a.x-menu2-h-en, .tbs .c-head .x-menu li.x-selected > a.x-menu2-en{ background-image:url(/imgs/c_header_on.en_06.png)!important; }
	.tbs .c-head .x-menu li > a.x-menu3-h-en, .tbs .c-head .x-menu li.x-selected > a.x-menu3-en{ background-image:url(/imgs/c_header_on.en_07.png)!important; }
	.tbs .c-head .x-menu li > a.x-menu4-h-en, .tbs .c-head .x-menu li.x-selected > a.x-menu4-en{ background-image:url(/imgs/c_header_on.en_08.png)!important; }

	/* For mobile */
	.tbs .c-head .x-mobnav-opener{
		display:none; position:absolute; top:5px; left:auto; right:5px; bottom:auto; width:30px; height:30px;
		background:#098eb4 url(/imgs/c_headermob_opener.png) no-repeat 0px 0px; background-size:30px 60px; border-radius:5px;
		pointer-events:auto; cursor:pointer;
	}
	.tbs .c-head .x-mobnav-opener.x-opened{ background-position:0px -30px; }

	@media screen and (max-width:999px){
		.tbs .c-head .x-mobnav-opener{ display:block; }
	}

	.tbs .c-mobnav{ z-index:99; display:none; position:fixed; top:40px; left:0; right:0; bottom:auto; width:100%; height:auto; box-shadow:0 0 10px #000; background:#fff; margin:0; padding:0; }
	.tbs .c-mobnav ul{ width:auto; height:auto; margin:15px; }
	.tbs .c-mobnav ul > li{ float:none; margin:0; width:auto; overflow:hidden; position:relative; }
	.tbs .c-mobnav ul > li a{ pointer-events:auto; display:block; margin:2px 0 0 0; padding:15px 15px; font-size:9pt; font-weight:bold; background:#098eb4; color:#fff; border-radius:4px; }
	.tbs .c-mobnav ul > li:first-child > a{ margin-top:0px; }


/* =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
	Footer
*/
	.tbs .c-foot{ overflow:visible; position:relative; width:100%; border-top:1px dotted #ddd; }
	.tbs .c-foot.x-topmargin{ margin-top:30px; }
	.tbs .c-foot footer{ overflow:hidden; position:relative; width:1000px; margin:0 auto 50px auto; padding:20px 0; }
	.tbs .c-foot footer p{ font-size:9pt; line-height:1.3em; color:#666; margin:0; padding:5px 0; }
	.tbs .c-foot .x-ntc{ font-size:8pt; line-height:1.4em; }

	@media screen and (max-width:999px){
		.tbs .c-foot.x-topmargin{ margin-top:20px; }
		.tbs .c-foot footer{ width:auto; margin:0 15px;
	}

