@charset "utf-8";

/*

==================================================

css/
 - reset.css
 - [[[ style.css ]]] <- This!

--------------------------------------------------

■サイトの基礎
■レイアウト
■コンテンツごとの固有スタイル
■汎用モジュール
■汎用クラス
■その他

2015.02.04 Shima

==================================================
*/

/*---------------------------------------------------------------

＜基準文字サイズ（13px）＞
    10px = 77%     11px = 85%     12px = 93%     13px = 100%
    14px = 108%    15px = 116%    16px = 123.1%  17px = 131%
    18px = 138.5%  19px = 146.5%  20px = 153.9%  21px = 161.6%
    22px = 167%    23px = 174%    24px = 182%    25px = 189%
    26px = 197%
	
----------------------------------------------------------------*/

/* ----------------------------------------
 サイトの基礎
---------------------------------------- */

/* CSS リセット
---------------------------------------- */
h1,h2,h3,h4,h5,h6,p,dl,dt,dd,ul,li { margin:0;padding:0; }
input[type="text"]:focus{ outline:none; }

/* ブラウザによるフォームのズレを回避 */
form { vertical-align: bottom; }
input,button { vertical-align:middle; }

/* 全要素にbox-sizing:boder-boxを指定
※パディングとボーダーを幅と高さに含める
---------------------------------------- */
* {
	box-sizing:border-box;
	}

/* フォント・テキスト
---------------------------------------- */
body, input, button, select, textarea {
	font-size:13px;
	font-family: Verdana, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	word-wrap: break-word;
	line-height: 1;
	background-color:#f3f3f3;
	color:#666;
	}

/* 段落 */
p,li {
	line-height: 1.2;
	}

/* リンク */
a:link { color: #002450; }
a:hover {  }
a:visited {  }
a:active {  }

/* テキスト要素 */
strong,b { font-weight: bold;}
em { font-weight: bold; font-style: italic;}

/* ----------------------------------------
 レイアウト
---------------------------------------- */

/* コンテナ
--------------------------------- */
.container { 
	padding-right: 10px;
	padding-left: 10px;
	margin-right: auto;
	margin-left: auto;
 }

/* ヘッダー
--------------------------------- */

.header {
	height: 67px;
	background-color: #d8eff7;
	border-top: solid 9px #006699;
	border-bottom: solid 1px #ccc;
	box-shadow: 0px 1px 1px #e6e6e6;
	}
.logo {
	margin-top: 7px;
	float: left;
	}
.logo a {
	display: block;
	text-indent: -9999px;
	width: 158px;
	height: 41px;
	background-image: url(../imgs/logo.png);
	background-position: 0 0;
	background-repeat: no-repeat;
	}
.header-bnr {
	float: right;
	margin-top: 3px;
	}
.header-bnr img{
	width: 141px;
	height: 51px;
	}


/* パンくず
--------------------------------- */
.breadcrumbs {
	margin-top: 2px;
	padding: 9px 5px;
	background : #fff;
	background : -webkit-gradient(linear, left top, left bottom, from(15%,#fff), to(#e6e6e6));
	background : -webkit-linear-gradient(top, #fff 15%, #e6e6e6);
	background : linear-gradient(to bottom, #fff 15%, #e6e6e6);
	font-size: 85%;
	color: #999;
	}
.breadcrumbs a {
	text-decoration: none;
	color: #999;
	margin-bottom: 10px;
	}

/* メイン
--------------------------------- */
.main { margin-bottom: 15px; }
section { margin-bottom: 10px; }

/* メイン h1見出し */
.main-heading {
	background-color: #002450;
	margin: 10px 0;
	padding: 11px;
	font-size: 123.1%;
	font-weight: normal;
	text-align: center;
	color: #fff;
	}
.main-heading-caption {
	display: block;
	font-size: 82%;
	}

.main-heading-sub {
	margin: 10px auto;
	padding: 0 5px;
	border-left: solid 15px #002450;
	font-size: 116%;
	color: #333;
	}

/* コンテンツボックス */
.cont-box {
	display: block;
	padding: 10px;
	margin-bottom: 10px;
	background-color: #fff;
	box-shadow:0px 1px 1px #ccc;
	}
.cont-title {
	margin: 10px auto;
	text-align: center;
	font-size: 116%;
	color: #000;
	}
.cont-date {
	text-align: right;
	margin-bottom: 10px;
	}


/* メイン アコーディオンメニュー */
/* アコーディオン タイトル */
.accordion-head {
	border-radius: 5px;
	padding: 16px;
	background-color: #002450;
	background : -webkit-gradient(linear, left top, left bottom, from(#003366), to(#001b42));
	background : -webkit-linear-gradient(top, #003366, #001b42);
	background : linear-gradient(to bottom, #003366, #001b42);
	font-size: 116%;
	margin-bottom: 2px;
	text-decoration: none;
	color: #fff;
	box-shadow: 0px 1px 1px #ccc;
	}
/* 下層コンテンツのアコーディオンタイトル
	背景色：青/文字色：白
*/
.cont-nav .accordion-head {
	background-color: #1291be;
	background : -webkit-gradient(linear, left top, left bottom, from(#54bbdf), to(#1291be));
	background : -webkit-linear-gradient(top, #54bbdf, #1291be);
	background : linear-gradient(to bottom, #54bbdf, #1291be);
	color: #fff;
	}

/* アコーディオン リスト */
.accordion-items {
	margin-bottom: 20px;
	padding: 0 5px;
	}
.accordion-item {
	clear:both;
	content:"";
	}
.accordion-item > a {
	display: block;
	padding: 15px 10px;
	margin-bottom: 1px;
	text-decoration: none;
	background-color: #fff;
	box-shadow:0px 1px 1px #ccc;
	}
.accordion-item-title {
	display: inline-block;
	}
.accordion-item-caption { 
	display: inline-block;
	margin-top: 1px;
	margin-right: 10px;
	float: right;
	font-size: 85%;
	color: #333;
	}

/* アコーディオン リスト 非アクティブ */
.accordion-item-disable a {
	cursor: default;
	background-color: #dfdfdf;
	color: #666;
	box-shadow: 0px 1px 1px #bbb;
	}

/* アコーディオン ボックス */
.addordion-item-box {
	display: block;
	padding: 15px 10px;
	margin-bottom: 2px;
	background-color: #fff;
	box-shadow:0px 1px 1px #ccc;
	}

/* サブアコーディオン */
.sub-accordion-head {
	display: block;
	padding: 15px 10px;
	margin-bottom: 1px;
	text-decoration: none;
	background-color: #fff;
	box-shadow:0px 1px 1px #ccc;
	}
.sub-accordion-open {
	background-color: #002450;
	color: #fff;
	}

/* アコーディオンを閉じるボタン */
.btn-accordion-close {
	text-align: center;
	padding: 10px;
	font-size: 116%;
	background-color: #fff;
	border-radius: 3px;
	color: #ababab;
	}
a.btn-accordion-close { color: #ababab; }


/* 注意文言 */
.explanation {
	margin: 20px 0;
	}



/* 共通リンク
--------------------------------- */
.common-link {
	margin-bottom: 35px;
	}
.common-link-item a {
	display: block;
	padding: 16px;
	font-size: 116%;
	margin-bottom: 2px;
	text-decoration: none;
	background-color: #fff;
	border-radius: 5px;
	box-shadow:0px 1px 1px #ccc;
	}

/* フッター
--------------------------------- */

/*サブメニュー*/
.nav-sub {
	margin-bottom: 20px;
	}
.nav-sub-item a {
	display: block;
	padding: 16px 10px;
	margin-bottom: 1px;
	font-size: 123.1%;
	text-decoration: none;
	background-color: #dedede;
	}

/*トップへ戻るボタン*/
.backtop {
	margin-bottom: 20px;
	}
.backtop-btn {
	text-align: center;
	padding: 16px;
	font-size: 116%;
	background-color: #e9e9e9;
	box-shadow:0px 1px 1px #ccc;
	color: #929292;
	}

/* 検索フォーム */
.footer-search {
	text-align: center;
	padding: 0 10px;
	margin-bottom: 10px;
	}
.footer-search-input {
	background: url(http://www.google.com/cse/intl/ja/images/google_custom_search_watermark.gif) 0% 50% no-repeat rgb(255, 255, 255);
	}
.footer-search-input:focus {
	background: none;
	background-color: #fff;
	}

/* 表示モード */
.dispray-mode {
	margin-bottom: 20px;
	text-align: center;
	}

/* コピーライト */
.copy { 
	text-align: center;
	font-size: 85%;
	}

/* ----------------------------------------
 コンテンツごとの固有スタイル
---------------------------------------- */

/* トップページ
---------------------------------------- */
/* 注意文言エリア */
.top_notice {
	margin-top: 10px;
	padding: 2px;
	border: double 3px #dd0f0f;
	background-color: #fff;
	color: #dd0f0f;
	}
.top-notice-text {
	float: left;
	padding-top: 3px;
	padding-left: 1px;
	width: 82%;
	height: 36px;
	line-height: 1.4;
	font-size: 93%;
	}
a.top-notice-btn {
	display: block;
	float: right;
	width: 17%;
	height: 36px;
	padding-top: 11px;
	border-radius: 3px;
	border: solid 1px #91121b;
	text-decoration: none;
	text-align: center;
	background-color: #e00019;
	background : -webkit-gradient(linear, left top, left bottom, from(#e00019), to(#bc0416));
	background : -webkit-linear-gradient(top, #e00019, #bc0416);
	background : linear-gradient(to bottom, #e00019, #bc0416);
	color: #fff;
	}
/* トップページ 見出し */
.main-heading-top {
	padding: 6px;
	margin-bottom: 2px;
	}

/* トップページ 国・地域別の海外安全情報 */

/* タブ部分 */
.top-area-tabs {
	margin: 2px 0;
	}
.top-area-tab {
	display: block;
	width: 49.5%;
	border-bottom: solid 1px #012551 ;
	background-color: #fff;
	background-position: right bottom;
	background-repeat: no-repeat;
	}
.top-area-tab a {
	display: block;
	height: 50px;
	padding-top: 10px;
	font-size: 116%;
	text-decoration: none;
	text-align: center;
	color: #012551;
	}
.top-area-tab a:after {
	content:"";
	display: block;
	margin: 8px auto 0 auto;
	width: 12px;
	height: 12px;
	background-image: url(../imgs/icon_arrow.png);
	background-position: -60px -40px;
	}
.top-area-tab-search {
	float: left;
	background-image: url(../imgs/top-area-tab-search_off.png);
	}
.top-area-tab-map {
	float: right;
	background-image: url(../imgs/top-area-tab-map_off.png);
	}

/* タブ部分 オープン時 */
.top-area-search-open {
	background-color: #1191be;
	background-image: url(../imgs/top-area-tab-search_on.png);
	}
.top-area-map-open {
	background-color: #1191be;
	background-image: url(../imgs/top-area-tab-map_on.png);
	}
.top-area-search-open a,
.top-area-map-open a { color: #fff; }
.top-area-search-open a:after,
.top-area-map-open a:after  {
	background-position: -40px 0;
	}
	
/* 国・地域名から探す */
.top-area-search {
	background-color: #f7f0dd;
	padding: 5px;
	}


/* 地図から探す */
.top-area-map {
	background-color: #f7f0dd;
	padding: 5px;
	}
/* 地図から探す 地図部分 */
.top-area-map-map {
	background-image: url(../imgs/top/top-area-map_off.png);
	background-size: contain;
	}
/* 地図から探す ボタン部分 */
.top-area-map-btn {
	padding: 5px;
	}
.top-area-map-btn-item {
	position: relative;
	background-color: #fff;
	border: solid 1px #cfcfcf;
	border-radius: 3px;
	margin-bottom: 5px;
	}
.top-area-map-btn-item a {
	display: block;
	padding: 8px 5px;
	font-size: 108%;
	text-decoration: none;
	color: #000;
	}
.top-area-map-btn-item span {
	display: block;
	padding-left: 20px;
	}
.top-area-map-btn-item span:before {
	content: "";
	display: block;
	width: 15px;
	height: 20px;
	position: absolute;
	left:5px;
	top:8px;
	background-image: url(../imgs/icon_pin.png);
	}
.map-btn-asia span:before { background-position: 0 0; }
.map-btn-oceania span:before { background-position: -20px 0; }
.map-btn-mideast span:before { background-position: -40px 0; }
.map-btn-europe span:before { background-position: 0 -20px; }
.map-btn-africa span:before { background-position: -20px -20px; }
.map-btn-america span:before { background-position: -40px -20px; }


/* トップページ 最新発出情報 */
.top-update {
	margin-bottom: 20px;
	}

/* トップページ アコーディオン */
.top-nav {
	margin-bottom: 2px;
	}

/* 国・地域名一覧
---------------------------------------- */
.area-nav { margin-bottom: 2px; }
.area-item a {
	color: #000;
	}
.area-nav-item-title {
	font-size: 138.5%;
	}
.accordion-item-icon:after {
	display:block;
	clear:both;
	content:"";
	}
.risk-icon {
	display: block;
	float: left;
	padding: 3px;
	border: solid 1px #000;
	margin-top: 3px;
	margin-right: 3px;
	font-size: 85%;
	background-color: #666;
	color: #000;
	}
.risk-level-04 {
	background-color: #ff0000;
	color: #fff;
	}
.risk-level-03 {
	background-color: #ff9900;
	}
.risk-level-02 {
	background-color: #ffcc00;
	}
.risk-level-01 {
	background-color: #ffff00;
	}
/* 
.risk-infection {
	background-color: #9999ff;
	}
*/
/* 感染症レベル */
.infection-level-04 {
	background-color: #333399;
	color: #fff;
	}
.infection-level-03 {
	background-color: #663399;
	color: #fff;
	}
.infection-level-02 {
	background-color: #cc99ff;
	}
.infection-level-01 {
	background-color: #99ccff;
	}


/* 国別ページ
---------------------------------------- */

/* マップ */
.country-map {
	background-color: #3a4e66;
	}
.country-map-show {
	padding: 5px;
	box-shadow: 0 1px 1px 0px #2d3c4f;
	}
.country-map-list {
	padding: 5px 0;
	height: 65px;
	overflow: hidden;
	}
.country-map-list-nav {
	position: relative;
	width: 36px;
	height: 50px;
	}
.country-map-list-nav span {
	display: block;
	text-indent: -9999px;
	}
.country-map-list-nav:before{
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 12px;
	height: 12px;
	margin-top: -6px;
	margin-left: -6px;
	background-image: url(../imgs/icon_arrow.png);
	}
.country-map-list-nav-prev { float: left; }
.country-map-list-nav-next { float: right; }
.country-map-list-nav-prev:before { background-position: -40px -60px; }
.country-map-list-nav-next:before { background-position: -40px -20px; }

.country-map-list-items {
	display: block;
	margin: 0 36px;
	}
.country-map-list-item {
	display: block;
	margin-right: 5px;
	float: left;
	}
.country-map-list-item img {
	height: 50px;
	}

/* メニューボタン */
.country-nav-item {
	width: 49.5%;
	float: left;
	margin-right: 2px;
	}
.country-nav-item:nth-child(even) {
	margin-right: 0;
	}
.country-nav-item a {;
	display: block;
	padding-top: 8px;
	padding-bottom: 8px;
	padding-left: 6px;
	margin-bottom: 2px;
	background-color: #fff;
	background : -webkit-gradient(linear, left top, left bottom, from(50%,#fff), to(#e6e6e6));
	background : -webkit-linear-gradient(top, #fff 50%, #e6e6e6);
	background : linear-gradient(to bottom, #fff 50%, #e6e6e6);
	border-radius: 3px;
	border: solid 1px #b2b2b2;
	font-size: 108%;
	text-decoration: none;
	color: #666;
	}
.country-nav-item a:hover {
	background : -webkit-gradient(linear, left top, left bottom, from(50%,#e6e6e6), to(#fff));
	background : -webkit-linear-gradient(top, #e6e6e6 50%, #fff);
	background : linear-gradient(to bottom, #e6e6e6 50%, #fff);
	}
.country-nav-item span {
	display: inline-block;
	padding: 5px;
	padding-right: 0;
	border-left-style: solid;
	border-left-width: 3px;
	}
.country-nav-safety { border-left-color: #7ec120; font-size: 100%; }
.country-nav-terror { border-left-color: #ce2020; font-size: 100%; }
.country-nav-manual { border-left-color: #ffdb12; font-size: 100%; }
.country-nav-medical { border-left-color: #b889c2; font-size: 100%; }

/* 発出情報ページ
---------------------------------------- */
.hazard-nav {
	margin-bottom: 2px;
	}
.hazard-detail {
	margin-bottom: 20px;
	}
.info-detail-message .message{
	margin-bottom: 5px;
	}
.info-detail-message .validmessage {
	color: #CC0000;
	margin-bottom: 20px;
	}
.info-detail-outline {
    margin-bottom: 10px;
	}




/* 安全対策基礎データ
---------------------------------------- */
.title-nav { margin-bottom: 2px; }

/* ----------------------------------------
汎用モジュール
---------------------------------------- */

/* 汎用モジュール ボタン
--------------------------------- */
.btn {
	display: block;
	text-decoration: none;
	}

/* ナビゲーション ボタン */
.btn-nav {
	font-size: 116%;
	background-color: #fff;
	border-radius: 3px;
	color: #ababab;
	padding: 10px;
	}
a.btn-nav { color: #ababab; }

.btn-readmore {
	text-align: center;
	}


/* 汎用モジュール リスト
--------------------------------- */

/* ※付きリスト */
.list-note {
	color: #999;
	font-size: 93%;
	text-indent: -1em;
	margin-left: 1em;
	}
.list-note:before {
	content: '※';
	
	}
.info-detail-outline .list-note{
    color: #666;
    margin-bottom: 5px;
}

/* 汎用モジュール 検索フォーム
--------------------------------- */
.search-form { position: relative; }
.search-input {
	width: 100%;
	padding: 5px;
	height: 36px;
	border: solid 2px #c1c1c1;
	border-radius: 5px;
	background-color: #fff;
	font-size: 116%;
	line-height: 1.1;
	}
.search-submit {
	position: absolute;
	right: 0;
	top: 0;
	height: 36px;
	width: 40px;
	text-indent: -9999px;
	background-image: url(../imgs/icon_search.png);
	background-repeat: no-repeat;
	background-position: center center;
	background-color: #c1c1c1;
	border: solid 2px #c1c1c1;
	border-radius: 0 5px 5px 0;
	}

/* 汎用モジュール 発出情報
--------------------------------- */
.update-head {
	padding: 5px;
	text-align: center;
	font-size: 116%;
	background-color: #1191be;
	color: #fff;
	margin-bottom: 3px;
	}
.update-item a {
	display: block;
	text-decoration: none;
	padding: 5px;
	margin-bottom: 2px;
	background-color: #fff;
	border-left: solid 2px #32b16c;
	color: #666;
	}
.update-item-new {
	color: #ff0000;
	}
.update-item-body {
	height: 2.4em;
	padding-right: 25px;
	overflow: hidden;
	text-overflow: ellipsis;
	}
/* 汎用モジュール 領事メール
--------------------------------- */
.update-item-ryoujimail-head {
	padding-right: 25px;
}
.update-no-ryoujimail-body {
	overflow: hidden;
    text-overflow: ellipsis;
	padding-top: 16px;
    padding-bottom: 16px;
	}
.update-ryoujimail-item-body {
	max-height: 8.2em;
    min-height: 2.4em;
	padding-right: 25px;
	overflow: hidden;
	text-overflow: ellipsis;
	}


/* ----------------------------------------
汎用クラス
---------------------------------------- */

/* 汎用クラス テキストカラー
--------------------------------- */
.txt-error { color: #E64A19; }
.fontcolor_red { color: #CC0000; }

/* 汎用クラス テキスト要素
--------------------------------- */
.txt-bold { font-weight:bold; }
.txt-big { font-size:116%; } /* 文字サイズ大：デフォルト13pxの場合 116%＝15px */
.txt-small { font-size:85%; } /* 文字サイズ小：デフォルト13pxの場合 85%＝11px */

/* 汎用クラス 画像
--------------------------------- */
.fulid { /* フルード（横幅に合わせて高さが可変する）画像用 */
	display: block;
	width: 100%;
	height: auto;
	}

/* 汎用クラス
　 メニュー内のアイコン
--------------------------------- */
.icon-arrow, .icon-link { position: relative; }
.icon-arrow:after, .icon-link:after {
	content:"";
	position: absolute;
	right: 10px;
	top:50%;
	}
span.icon-arrow, span.icon-link{
	padding-right: 20px;
	}
span.icon-arrow:after, span.icon-link:after {
	right: 0;
	}

/* リンクアイコン */
.icon-link:after { background-image: url(../imgs/icon_link.png); }

/* 外部ページへのリンク */
.icon-link-blank:after {
	margin-top: -5px;
	width:13px;
	height: 11px;
	background-position: 0 0;
	}
/* PCページへのリンク */
.icon-link-pc:after {
	margin-top: -8px;
	width:19px;
	height: 16px;
	background-position: 0 -20px;
	}
/* PDFへのリンク */
.icon-link-pdf:after {
	margin-top: -7px;
	width:13px;
	height: 15px;
	background-position: 0 -40px;
	}

/* 矢印アイコン */
.icon-arrow:after {
	margin-top: -6px;
	width: 12px;
	height: 12px;
	background-image: url(../imgs/icon_arrow.png);
	}

/* 矢印：グレー #ababab 上右下左 */
.icon-arrow-01-t:after { background-position: 0 0; }
.icon-arrow-01-r:after { background-position: 0 -20px; }
.icon-arrow-01-b:after { background-position: 0 -40px; }
.icon-arrow-01-l:after { background-position: 0 -60px; }

/* 矢印：ダークグレー #929292 上右下左 */
.icon-arrow-02-t:after { background-position: -20px 0; }
.icon-arrow-02-r:after { background-position: -20px -20px; }
.icon-arrow-02-b:after { background-position: -20px -40px; }
.icon-arrow-02-l:after { background-position: -20px -60px; }

/* 矢印：白 #ffffff 上右下左 */
.icon-arrow-03-t:after { background-position: -40px 0; }
.icon-arrow-03-r:after { background-position: -40px -20px; }
.icon-arrow-03-b:after { background-position: -40px -40px; }
.icon-arrow-03-l:after { background-position: -40px -60px; }



/* 汎用クラス レイアウト
--------------------------------- */
.ta_c { text-align:center; } /* テキスト中央揃え */
.ta_r { text-align:right; } /* テキスト右揃え */
.ta_l { text-align:left; } /* テキスト左揃え */
.fl_l { float:left; } /* 左にフロート */
.fl_r { float:right; } /* 右にフロート */


/* 汎用クラス グリッドレイアウト
--------------------------------- */
.row:after, .col:after {
	content : "";
	display: table;
	clear: both;
	}

/* グリッドカラム */
.col {
	float: left;
	margin-left: 2%;
	}
.col:first-child { margin-left: 0; }

/* 2分の1 */
.col_2 { width: 49%; }

/* 3分の1 */
.col_3 { width: 32%; }



/* 汎用クラス ボトムマージン
--------------------------------- */
.mb00 { margin-bottom: 0; }
.mb05 { margin-bottom: 5px; }
.mb10 { margin-bottom: 10px; }
.mb15 { margin-bottom: 15px; }
.mb20 { margin-bottom: 20px; }
.mb30 { margin-bottom: 30px; }
.mb40 { margin-bottom: 40px; }
.mb50 { margin-bottom: 50px; }
.mb60 { margin-bottom: 60px; }
.mb70 { margin-bottom: 70px; }
.mb80 { margin-bottom: 80px; }
.mb90 { margin-bottom: 90px; }
.mb100 { margin-bottom: 100px; }
.mb150 { margin-bottom: 150px; }


/* ----------------------------------------
 その他
---------------------------------------- */

/* clearfix
---------------------------------------- */

.clearfix:after {
	display:block;
	clear:both;
	content:"";
	}

/* pcinfectioninfo 注意文言
---------------------------------------- */
.topmessageboxSp {
	padding: 0px 5px 10px 5px;
	margin: 0 auto;
}

.topmessageSp {
    text-align: left;
    color: #ff0000;
    font-weight: bold;
    font-size: 1.1em;
}