@charset "shift_jis";

/* search
--------------------------------------------------------------------------	*/
ul#i_search_autocomplete {
	z-index:1000 !important;
}


/* headerwrap
--------------------------------------------------------------------------	*/
#headerwrap{
	min-width:905px;
	margin:0;
	text-align:center;
	background:url(/images/header/background_base.gif) repeat-x 0 0;
	border-bottom:#dadada 1px solid;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#headerwrap a{
	text-decoration:underline;
}

#headerwrap-inner{
	position:relative;
	width:905px;
	margin:0 auto;
	text-align:left;
/*	zoom:1;*/
}

#headerwrap img{
	border:none;
	vertical-align:top;
}

#headerwrap ul,
#headerwrap li,
#headerwrap p{
	list-style:none;
	margin:0;
	padding:0;
}

.login-info a.blet-link,
.errorLog a.blet-link{
	vertical-align:top;
/*	/vertical-align:baseline;*/
	margin-left:3px;
}

.login-info .icon-popup a,
.login-info a.icon-popup,
.errorLog .icon-popup a,
.errorLog a.icon-popup{
/*	/display:inline;
	/zoom:1;*/
}



/*	リンクカラー
--------------------------------------------------	*/
#headerwrap a,
.errorLog a{
    color:#093475;
}
#headerwrap a:visited,
.login-info-error a:visited{
    color:#7600b3;
}
#headerwrap a:hover,
.login-info-error a:hover{
    color:#3374da;
}



/* header
--------------------------------------------------------------------------	*/
#logo{
	position:absolute;
	top:0;
	left:7px;
	margin:0;
	padding:0;
	z-index:5;
}
#logo a{
	display:block;
}
#header #header-inner{
	position:relative;
	height:87px;
}


/* サイト内検索 */
#hn-search{
	position:absolute;
	top:10px;
	right:151px;
	margin:0;
	height:23px;
	width:188px;
	padding:0;
	background:url(/images/header/bg_search.gif) no-repeat 0 0;
	z-index:5;
/*	zoom:1;*/
}
#hn-search input{
	vertical-align:top;
}
#hn-search .searchBox,
#hn-search .query{
	height:19px;
	width:133px;
	margin:2px;
	padding:0;
	border:none;
	border-width:0 !important;
}


#hn-search .submit{
	height:23px;
	width:51px;
	background:#7d7d7d;
	margin:0;
	padding:0;
	border:none;
	border-width:0 !important;
}

/* ヘッダー上部ナビ */
#header p.login-log{
	position:absolute;
	width:360px;
	right:353px;
	top:18px;
	margin:0;
	padding:0;
	text-align:right;
	font-size:58% !important;
}


/* ヘッダーサブナビ */
#header ul#gn-secondnav{
	position:absolute;
	top:54px;
	right:189px;
	height:15px;
	overflow:hidden;
	z-index:5;
}
#header ul#gn-secondnav li{
	float:left;
	margin:0;
	padding:0;
	line-height:1;
}
#header ul#gn-secondnav li a{
	height:15px;
	padding-left:8px;
}
#header ul#gn-secondnav li a img{
	vertical-align:top;
}
#header ul#gn-secondnav li#hn-info{
	border-right:#dcdcdc 1px solid;
	margin-right:1px;
	padding:0 1px 0 0;
}

#header p#hn-mydocomo{
	position:absolute;
	top:41px;
	right:4px;
	z-index:5;
}
#header p#hn-mydocomo a{
	display:block;
}


/* 文字サイズ */
#header #font-area{
	position:absolute;
	top:10px;
	right:7px;
	height:23px;
	width:130px;
	background:url(/images/header/bg_font.gif?ver=140610) no-repeat 0 0;
	z-index:5;
}
#header ul#font{
	padding:4px 0 0 10px;
}
#header ul#font li{
	float:left;
	width:15px;
	padding-right:1px;
}
#header ul#font li.sizetxt{
	float:left;
	width:51px;
	padding:2px 10px 0 0;
}



/* グローバルナビゲーション
--------------------------------------------------------------------------	*/
#globalnav{
	height:40px;
	width:905px;
}

#globalnav #globalnav-inner{
/*	zoom:1;*/
	background:url(/images/header/bg_gn.gif) no-repeat 0 0;
}

#globalnav ul{
	padding:0 0 0 2px;
}

#globalnav li{
	float:left;
	height:40px;
}
#globalnav li a{
	height:40px;
}
#globalnav li#gn-home a{
	background-position:0 0;
}


/* ログイン情報
--------------------------------------------------------------------------	*/
.login-info{
	min-height:31px;
	clear:both;
	font-size:66%;
	line-height:1.45em;
	margin-top:1px;
	background-color:#f7f7f7;
}
* html .login-info{
	height:31px;
}

.login-info ul{
/*	zoom:1;*/
}
.login-info img{
	vertical-align:middle;
}

.login-info .login-info-inner{
	position:relative;
	padding:9px 8px 3px 8px;
/*	zoom:1;*/
}
.login-info-inner.none{
	display:none;
}
.login-info-inner.active{
	display:block;
}
.login-info p.noscript-text{
	position:relative;
	margin:0 !important;
	padding:9px 8px 3px 8px !important;
}

/*
.login-info .mobileUnsupported{
	position:relative;
	margin:0 8px !important;
	padding-top:9px !important;
	padding-bottom:7px !important;
}
*/


.login-info p.mobileUnsupported{
	position:relative;
	margin:9px 8px 7px 8px !important;
	padding-bottom:0;
}

.login-info ul{
	padding-right:115px;
}
.login-info li{
	display:inline-block;
/*	/display:inline;
	/zoom:1;*/
	margin-left:15px !important;
	padding-bottom:5px !important;
	vertical-align:top;
}
.login-info ul a.iconNone{
	background:none;
	padding-left:0;
}

.login-info p.info-logout,
.login-info p.info-login{
	position:absolute;
	top:5px;
	right:22px;
	z-index:5;
}
.login-info p.info-logout a,
.login-info p.info-login a{
	display:block;
}


/* error log
--------------------------------------------------------------------------	*/
.errorLog{
	min-width:905px;
	margin:0;
	text-align:center;
	font-size:66% !important;
	line-height:1.45em;
	border-bottom:#dadada 1px solid;
	background-color:#fff2f6;
}
.errorLog .errorInner{
	width:905px;
	margin:0 auto;
	padding:0;
	text-align:right;
}
.errorLog p{
	margin:0;
	padding:5px;
}



/* OSP対応
--------------------------------------------------------------------------	*/
/**********************************************************
* reset
**********************************************************/
.header div, .header pre, .header p, .header blockquote, .header dl, .header dt, .header dd, .header ul, .header ol, .header li,
.header h1, .header h2, .header h3, .header h4, .header h5, .header h6, .header form, .header fieldset, .header th, .header td {
  padding: 0;
}
.header p, .header ul {
  margin-top: 0;
  margin-bottom: 0;
}
.header dd {
  margin-left: 0;
}
.header input, .header textarea {
  margin: 0;
  padding: 0;
  font-size: 100%;
}
.header label {
  cursor: pointer;
}
.header table {
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 100%;
}
.header fieldset, .header img {
  border: 0;
}
.header img {
  vertical-align: top;
}
.header address, .header caption, .header cite, .header code, .header dfn, .header em, .header th, .header var {
  font-style: normal;
  font-weight: normal;
}
.header ol, .header ul {
  list-style: none;
}
.header caption, .header th {
  text-align: left;
}
.header h1, .header h2, .header h3, .header h4, .header h5, .header h6 {
  font-size: 100%;
  font-weight: normal;
}
.header q:after, .header q:before {
  content: '';
}
.header abbr, .header acronym {
  border: 0;
}
.header * {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.header a:focus, .header input:focus {
  outline: 1px dotted #000;
}



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

/* レイアウト
-------------------------------------------*/
html {
  font-size: 62.5%;
}

.header {
  display: block;
  padding-top: 12px;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
  font-size: 100%;
  line-height: 1.5;
}

  /* ヘッダー内リンク共通 */
  .header a {
    color: #093475;
    text-decoration: none;
  }
  .header a:visited {
    color: #7600b3;
  }
  .header a:hover,
  .header a:focus {
    text-decoration: underline;
    color: #3374da;
  }

  /* ヘッダー内コンテンツ */
  .header-in {
    margin: 0 auto;
    width: 940px;
/*    zoom: 1;*/
  }
  /* clearfix */
  .header-in:before {
    content: "";
    display: table;
  }
  .header-in:after {
    content: "";
    display: table;
    clear: both;
  }


/* ロゴ
-------------------------------------------*/
.header .header-logo {
  float: left;
  padding-top: 18px;
  width: 145px;
  height: 30px;
}

  .header-logo a {
    display: block;
  }

  .header-logo img {
    width: 100%;
    height: auto;
  }


/* ユーティリティ
-------------------------------------------*/
.header-pc {
  float: right;
}


/* フォントサイズ切替えエリア
-------------------------------------------*/
.header-fontsize {
  float: right;
  margin: 4px 0 0 15px;
}

  /* タイトル部分 */
  .header-fontsize .ttl {
    float: left;
    font-size: 71.42857%;
  }

  /* ボタン部分 */
  .header-fontsize .btn-box {
    float: left;
    margin-left: 5px;
  }

    /* 各ボタン */
    .header-fontsize .btn {
      float: left;
      margin-left: 2px;
    }
      .header-fontsize .btn a {
      	position: relative;
        display: block;
				width: 15px;
        height: 15px;
        box-sizing: border-box;
        overflow: hidden;
      }

      .header-fontsize .btn img {
        position: absolute;
        top: 0;
        left: 0;
      }

      /* アクティブ時 */
      .header-fontsize .is-active img {
        top: auto;
        bottom: 0;
      }

      /* マウスオーバー時 */
			.header-fontsize .btn a:focus:after,
      .header-fontsize .btn a:hover:after {
        content: "";
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        z-index: 1;
        background-color: rgba(0,0,0,0.14);
      }


/* 検索エリア
-------------------------------------------*/
.header-search {
  float: right;
  position: relative;
  width: 202px;
  height: 23px;
}

  /* 検索ボックス */
  .header-search .osp_searchBox {
    position: absolute;
    left: 0;
    top: 0;
    padding: 5px;
    width: 150px;
    height: 100%;
    border: 1px solid #ddd;
    background-color: #f6f6f6;
    line-height: normal;
    font-size: 71.42857%;
  }
  ::-webkit-input-placeholder {
      color: #333; }
  :-moz-placeholder {
      color: #333; opacity: 1; }
  ::-moz-placeholder {
      color: #333; opacity: 1; }
  :-ms-input-placeholder {
      color: #333; }

  /* 検索ボタン */
  .header-search .submit {
    width: 52px;
    height: 23px;
    position: absolute;
    right: 0;
    top: 0;
  }
  .header-search .submit:hover::after {
    display: block;
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 10;
    background-color: rgba(0,0,0,0.14);
  }


/* 前回ログイン日時
-------------------------------------------*/
/* clearfix */
.mod-last-loggedin:before {
  content: "";
  display: table;
}
.mod-last-loggedin:after {
  content: "";
  display: table;
  clear: both;
}
.mod-last-loggedin {
  float: right;
  margin: 4px 18px 0 0;
  color: #666;
  font-size: 78.57%;
}
  .mod-last-loggedin .label {
    float: left;
  }
  .mod-last-loggedin .label:after {
    content: "：";
  }
  .mod-last-loggedin .date {
    float: left;
  }

/* バナー
-------------------------------------------*/
.header-bnrs {
  float: right;
  clear: right;
  margin-top: 12px;
  border: 1px solid #d6d6d6;
}
  .header-bnrs a {
    display: block;
    position: relative;
  }
  .header-bnrs a:hover::after {
    display: block;
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 10;
    background-color: rgba(0,0,0,0.14);
  }


/* リンク
-------------------------------------------*/
.header .header-links {
  float: right;
  margin-top: 20px;
}
  .header-links .link {
    float: left;
    margin-right: 22px;
    padding-left: 11px;
    text-indent: -11px;
    font-size: 85.71%;
  }
  .header-links .link:before {
    display: inline-block;
    content: "";
    margin-right: 5px;
    width: 6px;
    height: 8px;
    background: url("/images_osp/common/ico/ico_arrow_r01.png") no-repeat left top;
    background-size: contain;
  }


/* グローバルナビ
-------------------------------------------*/
.nav-global {
  margin-top: 15px;
  height: 34px;
  border-bottom: 2px solid #c03;
  overflow: hidden;
}

  .nav-global-in {
    position: relative;
    bottom: -2px;
    height: 34px;
    margin: 0 auto;
    width: 940px;
/*    zoom: 1;*/
  }
  .nav-global-in:before {
    content: "";
    display: table;
  }
  .nav-global-in:after {
    content: "";
    display: table;
    clear: both;
  }

  /* 各ボタン */
  .nav-global .nav-item {
    float: left;
    width: 141px;
    height: 100%;
  }
  .nav-global .nav-item:last-child { width: 235px;}

    .nav-global .nav-item a {
      overflow: hidden;
      display: block;
      width: 100%;
      height: 100%;
    }

    /* 画像 */
    .nav-global .nav-item img { margin-left: 0; }
    .nav-global .nav-item.nav02 img { margin-left: -141px; }
    .nav-global .nav-item.nav03 img { margin-left: -282px; }
    .nav-global .nav-item.nav04 img { margin-left: -423px; }
    .nav-global .nav-item.nav05 img { margin-left: -564px; }
    .nav-global .nav-item.nav06 img { margin-left: -705px; }
    /* マウスオーバー時 */
    .nav-global .nav-item:hover img,
    .nav-global .nav-item:focus img { margin-top: -34px; }
    /* カレント時 */
    .nav-global .nav-item.is-current img { margin-top: -68px; }


/* 注意メッセージ エリア
-------------------------------------------*/
.header .area-attention {
  border-bottom: 1px solid #ddd;
  background-color: #f6f6f6;
}

/* コンテンツ部分 */
.header .mod-attention {
  margin: 0 auto;
  padding: 14px 0 11px;
  width: 940px;
  font-size: 85.71429%;
  text-align: left;
}
.header .txt-attention {
  margin-left: 30px;
  text-indent: -30px;
}
  .header .txt-attention .img {
    margin-right: 5px;
    vertical-align: middle;
  }
  .header .txt-attention a {
    text-decoration: underline;
  }
  .header .txt-attention a:hover {
    text-decoration: none;
  }


/* エラー表示 エリア
-------------------------------------------*/
.header .area-error {
  border-top: 1px solid #ffaab0;
  border-bottom: 1px solid #ffaab0;
  background-color: #ffeef0;
}
.header .mod-error {
  margin: 0 auto;
  width: 940px;
}
.header .txt-error {
  padding: 14px 10px 11px;
  text-align: right;
  font-size: 85.71429%;
}
.header .txt-error a {
  text-decoration: underline;
}
.header .txt-error a:hover {
  text-decoration: none;
}



/* 1to1 エリア
-------------------------------------------*/
/* エリア */
.header .area-o2o {
  border-bottom: 1px solid #ddd;
  background-color: #f6f6f6;
}

/* コンテンツ部分 */
.header .mod-o2o {
  margin: 0 auto;
  padding: 14px 0 11px;
  width: 940px;
  position: relative;
  font-size: 85.71429%;
  text-align: left;
}
.header .mod-o2o.logged-in {
  padding: 12px 0 9px;
}


/* テキスト部分 */
.header .txt-o2o {
  overflow: hidden;
  margin-left: -4px;
  padding-right: 90px;
}

/* 各項目 */
.header .item-o2o  {
  display: inline-block;
  margin-left: 4px;
  vertical-align: middle;
}

.header .item-o2o > * {
  display: inline-block;
}

/* ポイントエリア */
.header .item-o2o .point-area:not(:first-child) {
  margin-left: 4px;
}

/* ポイントロゴ */
.header .item-o2o .logo {
  margin: 0 0 2px 2px;
  vertical-align: middle;
}
.header .item-o2o .logo:first-child { margin-left: 0; }

/* XX：XXの部分 */
.header .item-o2o .label:after {
  content: ":";
  padding-right: 2px;
}
.header .item-o2o .logo + .label {
  margin-left: 4px;
}

/* ログインボタン */
.header .btn-o2o {
  position: absolute;
  right: 0;
  top: 50%;
  margin-top: -11px;
}
.header .btn-o2o:hover a:after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  background-color: rgba(0,0,0,0.14);
}

/* ログイン時 */
.header .mod-o2o.logged-in {
  font-size: 78.57143%;
}

/* 太字設定*/
.header .item-o2o .username,
.header .item-o2o .point {
  font-weight: bold;
}



/**********************************************************
 * ヘッダー共通アイコン
 **********************************************************/

/* アイコン
-------------------------------------------*/
.ico-header {
  display: inline-block;
}

/* 矢印アイコン */
.ico-header-arrow {
  position: relative;
  margin-left: 6px;
  padding-left: 1em;
  text-decoration: none;
}
.ico-header-arrow:before {
  content: '';
  display: inline-block;
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -4px;
  width: 6px;
  height: 8px;
  background: url("/images_osp/common/ico/ico_arrow_r01.png") no-repeat left top;
  background-size: contain;
}

/* 別窓アイコン */
.ico-header-link {
  position: relative;
  margin-left: 6px;
  text-decoration: none;
}
.ico-header-link:hover {
  text-decoration: underline;
}
  .ico-header-link .ico-header {
    display: inline-block;
  }
    .ico-header-link .ico-header img {
      margin-right: 3px;
      vertical-align: middle;
    }


/**********************************************************
 * 英語版切り替えリンク
 **********************************************************/

.header .header-lang-switch {
  display: inline-block;
  float:right;
  margin: 3px 18px 0 0;
}

.header .header-lang-switch a {
  font-size: 85.71%;
}