@charset "UTF-8";

/* ==================================================
=====================================================
=====================================================
  レスポンシブ default style
=====================================================
=====================================================
================================================== */
/* ---------------  レスポンシブ関連・初期設定  --------------- */
/* -----------------------------------
  共通
----------------------------------- */
.back_glay {
    z-index: 990;
}
.back_glay2, .back_glay3, .back_glay4 {
    z-index: 850;
}
.back_glay, .back_glay2, .back_glay3, .back_glay4 {
    background: #000000;
    height: 100%;
    opacity: 0.6;
    position: fixed;
    top: 0;
    width: 100%;
    display: none;
}

/* -----------------------------------
  ヘッダー
----------------------------------- */
#headerRightBlock {
  float: left;
}
#mobileMenuIconBlock {
  float: left;
}
#mobileMenuIconBlock #mobileMenuIcon {
  width: 60px;
  text-align: center;
}
#mobileMenuIconBlock #mobileMenuIcon svg {
  padding: 20px 10px 5px 10px;
  width: 50px;
}
#mobileMenuIconBlock #mobileMenuIcon span{
  font-size: 10px;
  line-height: 16px;
}
#headerMainNavBlock ul.mobile_nav_menu {
  width: 100%;
  padding: 6px 0;
  text-align: center;
}
#headerMainNavBlock ul.mobile_nav_menu li {
  float: none;
  border: none;
}

/* -----------------------------------
  フッター
----------------------------------- */
#footerMoblieNavWrappber {
    background-color: #efefef;
}
#footerMoblieNavBlock {
    padding-top: 15px;
    padding-bottom: 15px;
    text-align: center;
}
#footerMoblieNavBlock a{
    display: block;
}

/* -----------------------------------
  右カラム
----------------------------------- */
#rightBoxMobileBlock {
    margin-bottom: 20px;
}
/* -------------------- */
#rightBoxMobileBlock #rightBoxMMClose {
    text-align: right;
}
#rightBoxMobileBlock #rightBoxMMClose p {
    font-size: 1.0em;
    line-height: 18px;
}

#rightBoxMobileBlock #rightBoxMMClose span {
    position: relative;
    padding-left: 15px;
}
#rightBoxMobileBlock #rightBoxMMClose span:before {
    font-family: FontAwesome;
    content: "\f00d";
    font-size: 16px;
    line-height: 18px;
    color: #000000;
    position: absolute;
    left: 0;
    top: calc(0.5em);
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}
/* -------------------- */
#rightBoxMobileBlock #rightBoxMMList {
    margin-bottom: 20px;
}
#rightBoxMobileBlock #rightBoxMMList ul li:first-child {
    border-top: 1px dotted #3E3A39;
}
#rightBoxMobileBlock #rightBoxMMList ul li {
    display: block;
    padding-top: 3px;
    padding-bottom: 3px;
    border-bottom: 1px dotted #3E3A39;
}
#rightBoxMobileBlock #rightBoxMMList ul li a {
    display: block;
    font-size: 1.0em;
    line-height: 24px;
}
#rightBoxMobileBlock #rightBoxMMList ul li img {
    float: left;
    display: block;
    height: calc(20px + 4px);
    margin-right: 5px;
    padding-top: 2px;
    padding-bottom: 2px;
}

/* -----------------------------------
  メイン
----------------------------------- */
  #moblieCategoryNavMenuBlock {
    position: absolute;
    width: 100%;
    padding: 0 10px;
    top: 136px;
    z-index: 890;
    background-color: #f6dbde;
  }
  #moblieCategoryNavMenuBlock ul.moblie_category_nav_menu {
  }
  #moblieCategoryNavMenuBlock ul.moblie_category_nav_menu li.nav_home {
    display: none;
  }
  #moblieCategoryNavMenuBlock ul.moblie_category_nav_menu li {
    width: 100%;
    text-align: center;
    padding-top: 3px;
    padding-bottom: 3px;
    border-bottom: 1px dotted #b71c25;
  }
  #moblieCategoryNavMenuBlock ul.moblie_category_nav_menu li a {
    display: block;
    font-size: 1.0em;
    line-height: 24px;
    color: #b71c25;
  }
/* -------------------- */

#mobileFontChangeBlock {
  margin: 136px 0 0 0;
  width: 100%;
  background-color: #EFEFEF;
}
#mobileFontChangeBlock ul#fontChange ,
#mobileFontChangeBlock ul#fontChange002 {
    float: right;
}
#mobileFontChangeBlock ul#fontChange li ,
#mobileFontChangeBlock ul#fontChange002 li {
    display: block;
    margin: 0;
    padding: 0;
    width: calc(80px);
    height: calc(36px);
    float: left;
}
#mobileFontChangeBlock ul#fontChange li a ,
#mobileFontChangeBlock ul#fontChange002 li a {
    width: calc(100%);
    height: calc(100%);
    margin: 0;
    display: block;
    border: none;
    font-size: 1.0em;
    line-height: 36px;
    text-align: center;
}
#mobileFontChangeBlock ul#fontChange li a#fontM ,
#mobileFontChangeBlock ul#fontChange002 li a#fontM002 {
    background-color: #000;
    color: #fff;
}
#mobileFontChangeBlock ul#fontChange li a#fontL ,
#mobileFontChangeBlock ul#fontChange002 li a#fontL002 {
    background-color: #dcdddd;
    color: #3e3a39;
}
#mobileFontChangeBlock p#font_size_select ,
#mobileFontChangeBlock p#font_size_select002 {
    float: right;
    margin: 0;
    padding: 0 10px 0 15px;
    font-size: 1.0em;
    line-height: 36px;
    font-weight: 900;
    text-align: left;
}
/* -------------------- */


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




/* ---------------  表示  --------------- */
#headerSearchBlock 
{
  display: block;
}
/* ---------------  非表示  --------------- */
#mobileFontChangeBlock , 
#mobileMenuIconBlock ,
#headerMainNavBlock ul.mobile_nav_menu ,
#footerMoblieNavWrappber ,  
#rightBoxMobileBlock ,
#moblieCategoryNavMenuBlock ,
#moblieCategoryNavMenuBlock 
{
  display: none;
}



@media (min-width:0px) and (max-width:1040px){
/* ---------------  表示  --------------- */
  #headerRightBlock ,
  #headerSearchBlock ,
  #headerMainNavMenuBlock ul.nav_menu ,
  #fontChangeBlock ,
  #headerListBlock ,
  #headerListMenuBlock ,
  #contentRightWrapper ,
  #footerNavWrappber
  {
    display: block;
  }

/* ---------------  非表示  --------------- */
  #headerMainNavBlock ul.mobile_nav_menu ,
  #footerMoblieNavWrappber ,  
  #rightBoxMobileBlock ,
  #mobileMenuIconBlock ,
  #rightBoxMMList ,
  #mobileFontChangeBlock ,
  #moblieCategoryNavMenuBlock 
  {
    display: none;
  }
/* -----------------------------------
  フッター
----------------------------------- */
  .back_to_top {
    bottom: 20px;
    right: 20px;
  }
/* -----------------------------------
  トップページ
----------------------------------- */
  .bx-wrapper .bx-prev {
    left: 0 !important;
  }
  .bx-wrapper .bx-next {
    right: 0 !important;
  }
}
@media (min-width:0px) and (max-width:1000px){
/* -----------------------------------
  ヘッダー
----------------------------------- */
  header, 
  #headerMainWrapper, 
  #headerMainNavBlock {
    width: 100%;
  }
  #headerMainBlock, 
  #headerMainNavMenuBlock {
    padding: 0 10px;
    width: 100%;
  }
  #headerMainNavBlock ul li.nav_home ,
  #headerMainNavBlock ul li.nav_list {
    width: calc(100% / 7 - 1px);
  }
/* -----------------------------------
  フッター
----------------------------------- */
  footer ,
  #footerMainWrapper ,
  #footerNavWrappber ,
  #footerLogoWrapper ,
  #footerCopyrightWrapperq {
    width: 100%;
  }
  #footerNavBlock ,
  #footerLogoBlock ,
  #footerCopyrightBlock {
    padding-left: 10px;
    padding-right: 10px;
    width: 100%;
  }
/* -----------------------------------
  メイン
----------------------------------- */
  #contentMainWrapper ,
  #contentMainIndexWrapper ,
  #indexImgWrapper {
    width: 100%;
  }
  #contentMainBlock  {
    width: 100%;
  }
  #indexImgWrapper {
    width: 100%;
  }
  #contentMainIndexWrapper  {
    width: 100%;
  }
  #contentCenterWrapper {
    width: calc(100% - 210px - 40px);
    padding-left: 10px;
  }
  #contentRightWrapper {
    width: calc(200px + 10px);
    padding-right: 10px;
  }
}

/* 通常のhrより細い線 */
cp_hr01 {
	border-width: 1px 0 0 0;
	border-style: solid;
	border-color: #9fa0a0;
}