@charset "utf-8";

/*-- import css --*/

@import "common.css";
@import "sp-product.css";
@import "sp-review.css";





/* Basic Styles
-------------------------------------------------------------*/

body { font-size: 16px; }

#contener { padding: 1em 15px; clear: both; }
  #contener + * { clear: both; }

.inner { width: 100%; box-sizing: border-box; }

#content .swiper-container ul { display: -webkit-flex; display: flex; }

.swiper-slide { width: 42% !important; }





/* Form Styles
-------------------------------------------------------------*/

input[type="checkbox"] + label:before, input[type="radio"] + label:before { width: 18px; height: 18px; }

  input[type="checkbox"]:checked + label:before { background: url(../img/common/form_check.gif) no-repeat center; background-size: 16px; }

  input[type="radio"]:checked + label:before { background: url(../img/common/form_radio.gif) no-repeat center; background-size: 16px; }





/* Contents Styles
-------------------------------------------------------------*/

#contener h1 { font-size: 22px; }

#content h1, #content h2, #content h3, #content h4 { margin-bottom: 24px; }

#content h2, #content h3, #content h4 { font-weight: bold; line-height: 1.4; }

#content h2 {
  font-size: 1.13em;
  padding-bottom: 0.25em;
  border-bottom: 3px solid #00a3d9;
}

#content h3 {
  font-size: 1.07em;
  padding: 0.5em 0 0.5em 0.5em;
  border-left: 3px solid #00a3d9;
}

#content h4 { border-bottom: 2px dotted #00a3d9; display: inline-block; }



/* #mainPost */

#mainPost h2:before {
  border-bottom: 1px dashed #c3c3c3;
  margin: 0 -15px 1.88em;
  content: "";
  display: block;
}
  #mainPost h2:first-child:before { display: none; }

#mainPost p, #mainPost ul, #mainPost ol, #mainPost dl, #mainPost table { margin-bottom: 1.88em;}

#mainPost p { line-height: 1.64; }

#mainPost figure {
  width: 93.7%;
  max-width: 380px;
  margin: 0 auto 1.88em;
}

#mainPost figure img { width: 100%; }

#mainPost li { margin: 0 0 1.25em 1.5em; }
  #mainPost li:last-child { margin-bottom: 0; }

#mainPost ul li { list-style: disc; }

#mainPost ol li { list-style: decimal; }

#mainPost dl {
  border: 1px solid #ccc;
  padding: 1em 1em 0;
  font-size: 0.8em;
  display: inline-block;
  -webkit-border-radius: 0.6em;
     -moz-border-radius: 0.6em;
          border-radius: 0.6em;
}

#mainPost dt { font-weight: bold; margin-bottom: 0.88em; }

#mainPost dd { margin-bottom: 0.88em; line-height: 1.3; }

#mainPost table {
  border: 1px solid #ccc;
  border-bottom: none;
  font-size: 0.8em;
}

#mainPost table caption {
  text-align: left;
  font-weight: bold;
  margin-bottom: 8px;
}

#mainPost table th { background: #f7f7f7; text-align: left; }

#mainPost table th, #mainPost table td {
  border-bottom: 1px solid #ccc;
  padding: 6px 4px;
  line-height: 1.6;
}



/* .caution */

#mainPost .caution {
  border: 1px dashed #a1a1a1;
  padding: 1em 1em 0;
  margin-bottom: 2.25em;
  font-size: 13px;
  display: block;
  -webkit-border-radius: 0;
     -moz-border-radius: 0;
          border-radius: 0;
}

#mainPost .caution dt { font-weight: bold; margin-bottom: 1em; }

#mainPost .caution dd {
  color: #555;
  line-height: 1.6;
  margin-bottom: 1em;
}



/* navi */

.more a, .nav-page a, .nav-relation-post a {
  line-height: 1.2;
  padding-left: 20px;
  display: inline-block;
}

.more { margin-bottom: 1.88em; }

.more a { background: url(../img/common/icon_more.gif) no-repeat 0 2px; background-size: 15px; }

.nav-page, .nav-relation-post { margin-bottom: 1.88em; }

.nav-page li, .nav-relation-post li { margin-bottom: 1em; }
  .nav-page li:last-child, .nav-relation-post li:last-child { margin-bottom: 0; }

.nav-page:before, .nav-relation-post:before {
  font-weight: bold;
  margin-bottom: 1em;
  display: inline-block;
}

.nav-page:before { content: "このページでわかること"; }

.nav-relation-post:before { content: "あわせて読みたい"; }

.nav-page a { background: url(../img/common/icon_scroll.gif) no-repeat 0 2px; background-size: 15px; }

.nav-relation-post a { background: url(../img/common/icon_more.gif) no-repeat; background-size: 15px; }



/* #characteristic */

#characteristic dt {
  color: #00a3d9;
  line-height: 1.2;
  font-weight: bold;
  border: 1px solid #00a3d9;
  padding: 10px;
  margin-bottom: 20px;
  display: block;
  position: relative;
}
  #characteristic dt:after {
    background: url(../img/common/characteristic_after.gif) no-repeat bottom;
	background-size: 10px;
	width: 10px;
	height: 12px;
	display: block;
	content: "";
	position: absolute;
	  bottom: -12px;
  }

#characteristic dd {
  position: relative;
  padding-left: 1em;
  margin-bottom: 1em;
}
  #characteristic dd:before {
    content: "■";
    font-size: 0.88em;
    position: absolute;
      top: 0;
     left: 0;
  }





/* Category List Styles
-------------------------------------------------------------*/

.category-list {
  width: 100%;
  margin-bottom: 1em !important;
  overflow: hidden;
}

.category-list li {
  float: left;
  width: 46.4%;
  margin: 0 1.25em 1.25em 0;
  font-size: 13px;
  line-height: 1.3;
  box-sizing: border-box;
}

.category-list li:nth-child(2n) { margin-right: 0; }

.category-list li a {
  background: #fff;
  color: #1a1a1a;
  display: block;
  overflow: hidden;
  border: 1px solid #ccc;
  -webkit-border-radius: 0.3em;
     -moz-border-radius: 0.3em;
          border-radius: 0.3em;
  -webkit-box-shadow: 0 1px 0 0 #999;
     -moz-box-shadow: 0 1px 0 0 #999;
          box-shadow: 0 1px 0 0 #999;
}
  .category-list li a:hover {
    color: #c60;
    border-color: #c60;
    -webkit-box-shadow: none;
       -moz-box-shadow: none;
            box-shadow: none;
  }

.category-list li a span {
  float: left;
  width: 63.4%;
  padding: 10px;
  box-sizing: border-box;
}

.category-list li a img {
  float: right;
  background: #cdf4fd;
  width: 40px;
  padding: 18px 4px;
}





/* Group List Styles
-------------------------------------------------------------*/

/* .trouble-list */

.trouble-list { margin: 0 -2.5% -2.5% 0; overflow: hidden; }

.trouble-list li {
  float: left;
  width: 47.5%;
  margin: 0 2.5% 2.5% 0;
}

.trouble-list li a {
  padding: 1em;
  color: #333;
  text-decoration: none;
  display: block;
  box-sizing: border-box;
  border: 1px solid #ccc;
  -webkit-border-radius: 0.6em;
     -moz-border-radius: 0.6em;
          border-radius: 0.6em;
  -webkit-box-shadow: 0 1px 0 0 #999;
     -moz-box-shadow: 0 1px 0 0 #999;
          box-shadow: 0 1px 0 0 #999;
}
  .trouble-list li a:hover {
    border-color: #c60;
    -webkit-box-shadow: none;
       -moz-box-shadow: none;
            box-shadow: none;
  }


.trouble-list li .group-title { font-size: 14px; font-weight: bold; }

.trouble-list li img {
  width: 35px;
  float: right;
  margin: 0 0 10px 10px;
  -webkit-border-radius: 0.3em;
     -moz-border-radius: 0.3em;
          border-radius: 0.3em;
}

.trouble-list li p {
  clear: both;
  font-size: 13px;
  margin: 0 !important;
  line-height: 1.4 !important;
}



/* Button Styles
-------------------------------------------------------------*/

/* button.cart */

button.cart { width: 100%; }

button.cart span {
  line-height: 20px;
  font-size: 18px;
  display: table;
}
  button.cart span:before {
    background: url(../img/common/icon_set.png) no-repeat center;
    background-size: 80px;
    background-position: 0 0;
    width: 20px;
    height: 20px;
	margin-right: 4px;
  }

.first-cart button.cart { padding: 20px 0; }

.collect-cart-bottom button.cart { padding: 14px 0; }

#pricsListTable button { text-indent: -9999px; }

#pricsListTable button.cart { padding: 6px 12px; }

#pricsListTable button.cart span:before { margin-right: 0; }



/* .steps */

button.steps { width: 100%; }

button.steps { line-height: 46px; font-size: 18px; }
  button.steps span:before {
    background: url(../img/common/icon_steps.png) no-repeat center;
	background-size: 25px;
    width:  25px;
    height: 46px;
    margin-right: 6px;
  }



/* .action-cart */

.action-cart {
  border: 1px solid #a1a1a1;
  width: 180px;
  text-align: center;
  -webkit-border-radius: 0.3em;
     -moz-border-radius: 0.3em;
          border-radius: 0.3em;
}
  .action-cart:hover { border-color: #e03311; }

.action-cart a {
  line-height: 40px;
  color: #1a1a1a;
  text-decoration: none;
  display: block;
}

.action-cart a div {
  padding-left: 30px;
  margin: 0 auto;
  display: inline-block;
  position: relative;
}
  .action-cart a div:before {
    background: url(../img/common/icon_set.png) no-repeat;
    background-position: 0 -40px;
    width: 24px;
    height: 24px;
    display: block;
    content: "";
    position: absolute;
      top: 7px;
      left:  0;	
  }

.action-cart div span {
  background: #e03311;
  color: #fff;
  width: 24px;
  line-height: 24px;
  margin-left: 4px;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  display: inline-block;
  -webkit-border-radius: 50px;
     -moz-border-radius: 50px;
          border-radius: 50px;
}



/* aside */

.aside-header { position: relative; }

.aside-header .aside-title { font-size: 1.13em; padding-bottom: 6px; font-weight: bold; }

.aside-header .button {
  font-size: 14px;
  display: inline-block;
  position: absolute;
    top: -10px;
  right:    0;
}
  .aside-header .button a:before { content: "一覧"; padding: 6px 8px; display: inline-block; }
  .aside-header .button a span { display: none; }

.aside-header p {
  font-size: 0.88em;
  line-height: 1.3;
  margin-bottom: 1.15em;
}



/* ranking */

.ranking .product-rank {
  font-size: 1.2em;
  line-height: 30px;
  width: 30px;
  position: absolute;
    top: 0;
   left: 15px;
}


.ranking-bottom .button { margin: 0 15px; }

.ranking-bottom .button a { font-size: 14px; padding: 8px 10px; }





/* User Styles
-------------------------------------------------------------*/

/* common */

.enter-action {
  clear: both;
  font-size: 13px;
  text-align: center;
  margin: 0 15px 1.25em;
  overflow: hidden;
}

.enter-action .button {
  line-height: 40px;
  margin-bottom: 1em;
  font-size: 15px;
}



/* #loginUser */

#loginUser.enter-action .icon-user a {
  width:  50px;
  height: 50px;
  margin: 0 auto 0.88em;
  display: block;
}

#loginUser.enter-action .icon-user img {
  width: 50px;
  border: 2px solid #00a3d9;
  -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
          border-radius: 50%;

}

#loginUser.enter-action b { margin: 0 auto 1.25em; display: inline-block; }

#loginUser.enter-action .action-cart { margin: 0 auto 1.25em; }

#loginUser.enter-action p {
  text-align: left;
  font-size: 13px;
  line-height: 1.5;
  margin-bottom: 1.15em;
}

#loginUser.enter-action p span {
  color: #e03311;
  font-weight: bold;
  padding: 0 3px;
}





/* Navigation Styles
-------------------------------------------------------------*/

/* header#top */

header#top {
  min-height: 48px;
  padding: 10px 0;
  border-bottom: 1px solid #a1a1a1;
  box-sizing: border-box;
}

header#top #siteLogo {
  background: url(../img/common/siteLogo_sp_s.gif) no-repeat center;
  background-size: 90px;
  width:  90px;
  height: 28px;
  margin: 0 10px 0 15px;
  text-indent: -9999px;
  display: block;
}

header#top h1,
header#top .nav-cart, header#top .nav-login,
header#top .nav-entry { float: left; display: inline-block; }

header#top .nav-cart a { text-decoration: none; position: relative; display: block; }

header#top .nav-cart a div { text-indent: -9999px; }

header#top .search-box { padding-top: 10px; clear: both; }
  header#top .search-box:before {
    border-top: 1px solid #a1a1a1;
    height: 10px;
    display: block;
    content: "";
  }

header#top .search-box form { margin: 0 15px; }

header#top .search-box ul {
  font-size: 13px;
  margin: 10px 15px 0;
  overflow: hidden;
}

header#top .search-box ul li { float: left; margin-right: 16px; }

header#top .nav-login { margin: 0 1em; }

header#top .nav-login a { font-size: 13px; line-height: 28px; }

header#top .nav-entry { display: none; }

header#top .nav-cart span,
#footerMenu #nav-foot-menu .icon-cart span {
  background: #e03311;
  color: #fff;
  width: 20px;
  line-height: 20px;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
  display: inline-block;
  -webkit-border-radius: 50px;
     -moz-border-radius: 50px;
          border-radius: 50px;
}

header#top .nav-cart a {
  background: url(../img/common/icon_cart.png) no-repeat 0 bottom;
  background-size: 25px;
  background-position: 0 0;
  width:  40px;
  height: 28px;
}

header#top .nav-cart a span {
  position: absolute;
    top: -2px;
   right:   0;
}



/* .nav-account */

.nav-account {
  float: left;
  margin-left: 10px;
  position: relative;
}

.account-user {
  width: 110px;
  font-size: 11px;
  overflow: hidden;
  cursor: pointer;
}

.account-user .icon-user {
  float: left;
  margin-right: 6px;
  display: inline-block;
}

.account-user .icon-user img {
  width:  24px;
  height: 24px;
  border: 1px solid #00a3d9;
  -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
          border-radius: 50%;
}

.account-user .account-name {
  width: 70px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 2px 0;
}

.account-user span { color: #e03311; font-weight: bold; }

.account-menu {
  width: 180px;
  background: #fff;
  box-sizing: border-box;
  z-index: 10;
  border: 1px solid #a1a1a1;
  -webkit-border-radius: 0.3em;
     -moz-border-radius: 0.3em;
          border-radius: 0.3em;
  position: absolute;
     top: 32px;
}

.account-menu ul { width: 100%; }

.account-menu li, .account-menu span { border-bottom: 1px dashed #a1a1a1; }
  .account-menu li:last-child { border-bottom: none; }

.account-menu a, .account-menu span {
  font-size: 14px;
  padding: 10px;
  box-sizing: border-box;
  display: block;
}

.account-menu span { font-weight: bold; }

.account-menu a { text-decoration: none; }



/* search-box */

.search-box { width: 100%; overflow: hidden; }

.search-box form input {
  height: 40px;
  line-height: 28px;
  border: 1px solid #00a3d9;
  box-sizing: border-box;
}

.search-box form input[type=search] {
  float: left;
  width: 88%;
  padding-left: 8px;
  font-size: 16px;
  -webkit-border-bottom-right-radius: 0;
      -moz-border-radius-bottomright: 0;
          border-bottom-right-radius: 0;
     -webkit-border-top-right-radius: 0;
         -moz-border-radius-topright: 0;
             border-top-right-radius: 0;
}

.search-box form input[type=submit] {
  background: url(../img/common/icon_search.png) no-repeat center #00a3d9;
  background-size: 16px;
  width: 12%;
  text-indent: -9999px;
  -webkit-border-bottom-left-radius: 0;
      -moz-border-radius-bottomleft: 0;
          border-bottom-left-radius: 0;
     -webkit-border-top-left-radius: 0;
         -moz-border-radius-topleft: 0;
             border-top-left-radius: 0;
}

#listPage .search-box .center-search { margin: 1.88em 0; }



/* .search-word */

.search-word {
  font-size: 14px;
  padding: 0.6em;
  border: 1px dashed #333;
  box-sizing: border-box;
  -webkit-border-radius: 0.4em;
     -moz-border-radius: 0.4em;
          border-radius: 0.4em;
}

.search-word ul { font-size: 0.94em; overflow: hidden; }
  .search-word ul:before {
    content: "よく検索されているキーワード";
    margin: 0.3em 0;
    font-weight: bold;
    display: block;
  }

.search-word li { float: left; margin: 0.3em; }

#listPage .search-word { margin-bottom: 1.88em; }



/* #nav-menu */

.sp-menu {
  background: url(../img/common/icon_menu_sp.gif) no-repeat center;
  background-size: 36px;
  width:  36px;
  height: 30px;
  text-indent: -9999px;
  display: block;
  cursor: pointer;
  position: absolute;
     top: 8px;
   right: 8px;
}

#watchPage .sp-menu { display: none; }

#nav-menu {
  display: none;
  width: 100%;
  background: #f5f5f5;
  z-index: 100;
  position: absolute;
    top: 0;
   left: 0;
}

#nav-menu nav { font-size: 15px; clear: both; }

#nav-menu nav a { text-decoration: none; display: block; }

#nav-menu nav h2 {
  background: url(../img/common/icon_nav_menu.png) no-repeat right center #00a3d9;
  padding: 8px 16px;
}

#nav-menu nav h2 a { color: #fff; font-weight: bold; }

#nav-menu nav h3 {
  line-height:  35px;
  padding-left: 30px;
  background: #fff;
  border-bottom: 1px solid #a1a1a1;
  cursor: pointer;
  position: relative;
}
  #nav-menu nav h3:before {
    background: url(../img/common/icon_nav_menu_sp.gif) no-repeat #fff;
    background-size: 25px;
    width:  25px;
    height: 25px;
    display: inline-block;
    content: "";
    position: absolute;
      top: 5px;
     left: 5px;
  }
  #nav-menu nav h3#nav-icon1:before { background-position: 0    0px; }
  #nav-menu nav h3#nav-icon2:before { background-position: 0  -25px; }
  #nav-menu nav h3#nav-icon3:before { background-position: 0  -50px; }
  #nav-menu nav h3#nav-icon4:before { background-position: 0  -75px; }
  #nav-menu nav h3#nav-icon5:before { background-position: 0 -100px; }
  #nav-menu nav h3#nav-icon6:before { background-position: 0 -125px; }
  #nav-menu nav h3#nav-icon7:before { background-position: 0 -150px; }

  #nav-menu nav h3:after {
    background: url(../img/common/nav_icon_open.gif) no-repeat center -8px;
    background-size: 50px;
    width:  35px;
    height: 35px;
    display: block;
    content: "";
    position: absolute;
       top: 0;
     right: 0;
  }
    #nav-menu nav h3.open:after { background-position: center -58px; }

#nav-menu nav ul { background: #fff; width: 100%; }

#nav-menu nav ul li a { padding: 8px 8px 8px 30px; border-bottom: 1px dashed #a1a1a1; }
  #nav-menu nav ul li:last-child a { border-bottom-style: solid; }

.sp-menu-open { height: 50px; }

.sp-menu-open .tab {
  float: left;
  width: 104px;
  line-height: 36px;
  margin: 14px 4px 0 6px;
  background: #fff;
  color: #00a3d9;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
  cursor: pointer;
  -webkit-border-top-right-radius: 0.4em;
      -moz-border-radius-topright: 0.4em;
          border-top-right-radius: 0.4em;
   -webkit-border-top-left-radius: 0.4em;
       -moz-border-radius-topleft: 0.4em;
           border-top-left-radius: 0.4em;
  }

.sp-menu-open .tab.open {
  line-height: 46px;
  margin-top: 4px;
  border: 1px solid #00a3d9;
  border-bottom: none;
}

.sp-menu-open .nav-close {
  background: url(../img/common/icon_nav_close.gif) no-repeat center #fff;
  background-size: 45px;
  width:  50px;
  height: 50px;
  text-indent: -9999px;
  cursor: pointer;
  display: block;
  position: absolute;
     top: 0;
   right: 0;
}

#nav-menu-cate ul { display: none; }
	
#nav-menu-grup { display: none; }



/* #breadcrumb */

#breadcrumb {
  font-size: 0.92em;
  margin-bottom: 1.88em;
  padding: 0 15px;
  overflow: hidden;
}

#breadcrumb li { float: left; line-height: 20px; }
  #breadcrumb li:after { content: "›"; margin: 0 4px; }
  #breadcrumb li:first-child a {
    background: url(../img/common/icon_home.gif) no-repeat center;
    background-size: 20px;
    width:  20px;
    height: 20px;
	content: "";
    text-indent: -9999px;
    display: inline-block;
    -webkit-border-radius: 50px;
       -moz-border-radius: 50px;
            border-radius: 50px;
  }

#breadcrumb a { text-decoration: none; }



/* #toTop */

#toTop { background-color: #1a1a1a; text-align: center; }

#toTop a {
  color: #fff;
  text-decoration: none;
  padding: 1em 0;
  display: block;
}



/* #footerMenu */

#footerMenu { padding: 1em 15px 0; overflow: hidden; }

#footerMenu #nav-foot-menu {
  border-top: 1px solid #a1a1a1;
  margin: 1em -15px 0;
  overflow: hidden;
}

#footerMenu #nav-foot-menu li {
  float: left;
  font-size: 13px;
  width: 50%;
  box-sizing: border-box;
  border-bottom: 1px solid #a1a1a1;
}
  #footerMenu #nav-foot-menu li:nth-child(odd) { border-right: 1px solid #a1a1a1; }

#footerMenu #nav-foot-menu li a {
  line-height: 22px;
  padding: 10px 0 10px 34px;
  color: #1a1a1a;
  text-decoration: none;
  display: block;
  position: relative;
}
  #footerMenu #nav-foot-menu li a:hover { text-decoration: underline; }
  #footerMenu #nav-foot-menu li a:before {
    background: url(../img/common/icon_set.png) no-repeat;
	background-size: 80px;
    width: 20px;
	height: 20px;
	margin-left: 10px;
    content: "";
    position: absolute;
       top: 10px;
      left: 0;
  }

#footerMenu #nav-foot-menu li.icon-cart a:before { background-position:     0 0; }
#footerMenu #nav-foot-menu li.icon-cate a:before { background-position: -20px 0; }
#footerMenu #nav-foot-menu li.icon-trbl a:before { background-position: -40px 0; }
#footerMenu #nav-foot-menu li.icon-wtch a:before { background-position: -60px 0; }

#footerMenu #nav-foot-menu li.icon-cart span { margin-left: 4px; }



/* #siteInfo */

#siteInfo {
  border-top: 1px solid #a1a1a1;
  padding: 1em 0;
  font-size: 0.8em;
  color: #666;
  text-align: center;
}

#siteInfo ul {
  width: 300px;
  margin-bottom: 0 auto 10px;
  text-align: center;
  display: inline-block;
  overflow: hidden;
}

#siteInfo li { margin: 0 6px 10px; display: inline-block; }

#siteInfo a { color: #666; }

#siteInfo address { font-size: 11px; }



/* #areaSupport */

#areaSupport {
  background: url(../img/common/bg_areaSupport_sp.gif) no-repeat center;
  background-size: 280px;
  height: 180px;
}

#areaSupport span, #areaSupport ul { display: none; }


/* .nav-tag */

.nav-tag, .nav-panel { margin: 0 -10px 1.25em 0; overflow: hidden; }

.nav-tag li, .nav-panel li { margin: 0 10px 10px 0; }

.nav-tag li { float: left; }

.nav-tag li a, .nav-panel li a {
  background: #cdf4fd;
  border-bottom: 1px solid #aaa;
  text-decoration: none;
  display: inline-block;
  -webkit-border-radius: 0.3em;
     -moz-border-radius: 0.3em;
          border-radius: 0.3em;
}

.nav-tag li a { font-size: 14px; padding: 8px 8px; }

.nav-set { margin-bottom: 1em; overflow: hidden; }
  .nav-set:last-child { margin: 0; }

.nav-set b { margin-bottom: 1.05em; display: block; }



/* .nav-panel */

.nav-panel li { float: left; }

.nav-panel a span { display: none; }

.nav-panel img { width: 90px; }



/* .box-menu */

.box-menu {
  width: 100%;
  line-height: 40px;
  font-size: 12px;
  font-weight: bold;
  border: 1px solid #00a3d9;
  text-align: center;
  display: table;
  table-layout: fixed;
  cursor: pointer;
  -webkit-border-radius: 0.3em;
     -moz-border-radius: 0.3em;
          border-radius: 0.3em;
}

.box-menu li {
  border-right: 1px solid #00a3d9;
  display: table-cell;
  vertical-align: middle;
  box-sizing: border-box;
}
  .box-menu li:last-child { border-right: none; }

.box-menu li a {
  color: #00a3d9;
  text-decoration: none;
  display: block;
}

.box-menu li.focus a { background: #00a3d9; color: #fff; }




/* .pager */

.pager { margin: 1.88em auto; display: table; }

.pager a { text-decoration: none; }

.pager .pg-box { display: none; }

.pager .pg-box a { border: 1px solid #039; display: block; }
.pager .pg-box a:hover { border-color: #c60; }

.pager .arrow span {
  background: url(../img/common/arrow_pager.gif) no-repeat;
  line-height: 24px;
  display: inline-block;
}

.pager .arrow.prev span { background-position: 0 0px; padding-left: 30px; margin-right: 1.88em; }
  .pager .arrow.prev a span { background-position: 0 -24px; }
    .pager .arrow.prev a:hover span { background-position: 0 -48px; }

.pager .arrow.next span { background-position: right -72px; padding-right: 30px; }
  .pager .arrow.next a span { background-position: right -96px; }
    .pager .arrow.next a:hover span { background-position: right -120px; }



/* .back-page */

.back-page { margin-bottom: 24px; }

.back-page a {
  color: #fff;
  text-decoration: none;
  position: relative;
  line-height: 26px;
  display: inline-block;
}

.back-page a span {
  background: #00a3d9;
  font-size: 15px;
  padding: 0 10px;
  display: inline-block;
  position: relative;
    left: 10px;
}
  .back-page a:before {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 13px 10px 13px 0;
    border-color: transparent #00a3d9 transparent transparent;
    content: "";
    position: absolute;
      top: 0;
     left: 0;
  }
  .back-page a:hover span { background: #c60; }
    .back-page a:hover:before { border-color: transparent #c60 transparent transparent; }



/* .nav-guide */

.nav-guide li {
  border-bottom: 1px dashed #a1a1a1;
  padding-bottom: 1.25em;
  margin-bottom: 1.25em;
}

.nav-guide li .guide-title { margin-bottom: 10px; }

.nav-guide li p { font-size: 0.88em; margin-bottom: 0 !important; }