@charset "UTF-8";


/*
 ■■ 基本設定
========================================================= */
#header {
    padding: 10px 0 !important;
}
#gNavi ul {
    padding: 0 !important;
}

#contWrap {
    width: 100%;
    max-width: 100%;
}

#contWrap a:link {
  color: #0c1e89;
}

#contWrap a:visited {
  color: #551a8b;
}

#contWrap a:hover {
  color: #0c1e89;
  text-decoration: none;
}

#contWrap a:hover img {
  opacity: 0.8;
  filter: alpha(opacity=80);
  /* For IE8 and earlier */
}

#contWrap a:active {
  color: #551a8b;
}

.w95p {
    width: 95% !important;
}

input[type="text"], input[type="password"] {
    width: 100%;
}
/*
 ■■ ページ幅
========================================================= */
#allWrapper {
  width: 100%;
}

#wrapper {
  width: 100%;
}

#header{
  max-width: 100%;
  min-width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding: 0 10px;
}

#footer {
  margin: 0 auto;
  min-width: auto;
  width: 100%;
}

#footer .footAreaTop ul,
#footer .footNavArea,
#footer .footAreaBottom ul {
  max-width: 100%;
  min-width: 100%;
  margin-right: auto;
  margin-left: auto;
}

#contWrap {
  margin-bottom: 70px;
}

/*
 ■■ キービジュアル
========================================================= */
.gtop_keyVisualWrap{
  height:auto;
  margin-bottom: 10px;
  margin-top: 10px;
}
.gtop_keyVisualInner{
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  position:relative;
  display: block;
  visibility: hidden;
  padding-bottom: 20px;
}
.gtop_keyVisualInner.slick-slider{
  visibility: visible;
  padding-bottom: 0px;
}

.gtop_keyVisualInner > div{
    display: none;
}
.gtop_keyVisualInner > div:first-child{
    display: block;
}

.slick-slide img {
    width: 100%;
    height: auto;
}

.slick-dots {
    position: relative !important;
    top: 0;
    text-align: center;
    margin: 0;
}

.slick-dots li {
    width: 20px;
    height: 20px;
}

.slick-dots li button
{
    font-size: 0;
    line-height: 0;

    display: block;

    width: 20px !important;
    height: 20px !important;
    padding: 5px;

    cursor: pointer;
    content: " ";
    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
    background-image: none !important;
}
.slick-dots li.slick-active button {
    width: 20px !important;
    height: 20px !important;
}
.slick-dots li.slick-active button:before {
    opacity: 1.0;
}
.slick-dots li button:before
{
    background-image: none;
    color: #777777 !important;
    content: "●" !important;
    opacity: 1.0;
}


.slick-dots li.slick-active button:before
{
    background-image: none;
    color: #777777 !important;
    content: "●" !important;
}
/*
 ■■ 重要なお知らせ
========================================================= */
.ktop_importantAreaWrap{
  width: 100%;
  margin-right: auto;
  margin-left: auto;
}
.ktop_importantAreaInner{
    padding:5px;
}
/* ----- インフォーメーションアイコン ----- */
.iconTInfo {
  background: url(/responsive/img/index_icon_info.png) no-repeat left top;
  padding-left: 32px;
  padding-top: 3px;
  padding-bottom: 3px;
  zoom: 1;
  
  color:#e20019;
  font-size:16px;
  font-weight: bold;
}

.ktop_importantAreaWrap dl{
    padding:0 32px;
}
.ktop_importantAreaWrap dl dt{
    width:100%;
    float:none;
}
.ktop_importantAreaWrap dl dd{
    width:100%;
    float:none;
    margin-left: 10px;
    margin-bottom:10px;
}

/*
 ■■ 情報エリア
========================================================= */
.ktop_infoAreaWrap{
    background-color:#fafafa;
    box-shadow: 0px 3px 3px rgba(0,0,0,0.1);
}
.ktop_infoAreaInner{
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  display:table;
  table-layout:fixed;
  padding-top: 20px;
  padding-bottom: 20px;
}
.ktop_infoAreaInner .ktop_infoBox{
    display:block;
    text-align:center;
}
.ktop_infoAreaInner .ktop_infoBox:FIRST-CHILD{
    margin-bottom:20px;
    }
.ktop_infoAreaInner .ktop_infoBox .boxAreaL{
    width: 100% !important;
    float: none !important;
    padding: 0 10px;
    text-align: center;
}
.ktop_infoAreaInner .ktop_infoBox .boxAreaR{
    width: 100% !important;
    float: none !important;
    padding: 0 10px;
}
.ktop_infoAreaInner .ktop_infodBox .link{
    text-align:left;
}
.ktop_infoAreaInner .ktop_infoBox.line{
    border-right: none;
}
.ktop_infoAreaWrap img:hover{
    cursor:pointer;
}
.ktop_infoAreaWrap .catch,
.ktop_infoAreaWrap .img{
    margin-bottom:10px;
}
.ktop_infoBox .img{
    height:95px;
    position:relative;
}

.ktop_infoBox .loginInfoBox {
    border:1px solid #dbdbdb;
    background-color: #fdfdfd;
    padding: 10px;
}
.ktop_infoBox .loginInfoBox ul.inputText{
  width:100%
}
.ktop_infoBox .loginInfoBox .inputText li{
    margin-top:10px;
}

.ktop_infoBox .loginInfoBox ul li input {
    width:91%;
}
.ktop_infoBox .loginInfoBox input[type=submit] {
    font-size: 14px;
}

.ktop_infoBox dl dt {
    text-align: left;
    font-size: 145%;
    font-weight:bold;
    color: #2f715a;
}


.ktop_infoAreaInner .ktop_infoBox .boxAreaR img {
    width: 100%;
    height: auto;
}

.ktop_infoAreaInner .ktop_infoBox .boxAreaR td{
    float: left\9;
    clear: both\9;
    display: block;
    padding: 4px 0;
}

.boxAreaR  dd table{
    margin: 0 auto;
    width: 100%;
}

/* Capy */
.capyArea {
    width: 100%;
}

/* _index3.jsp 用 */
.ktop_infoAreaInner .ktop_infoBox .boxAreaR .areaR, .ktop_infoAreaInner .ktop_infoBox .boxAreaR .areaL{
    display: block;
    vertical-align: top;
    margin-top: 16px;
    font-size: 14px;
}
.ktop_infoAreaInner .ktop_infoBox .boxAreaR .areaL dd{
    padding: 4px 0 !important;
    
}

.ktop_infoAreaInner .ktop_infoBox .boxAreaR .areaR dd {
    height: auto;
    padding: 0 !important;
    margin-bottom:10px;
}

.ktop_infoAreaInner .ktop_infoBox .boxAreaR .areaR dd ul li{
    margin-bottom:10px;
}

.ktop_infoAreaInner .ktop_infoBox .boxAreaR table tr td{
    padding: 4px 0;
}
/*
 ■■ おすすめエリア
========================================================= */
.gtop_serviceAreaWrap{
    width: 100%;
}
.gtop_serviceAreaInner{
  background-color:#f9f9f9;
  table-layout:fixed;
  height: 200px;
}
.gtop_serviceAreaInner ul {
        margin:0 auto;
    text-align: center;
}
.gtop_serviceAreaInner ul li {
    display: inline-block;
    padding: 5px;
    margin-bottom: 10px;
}
.gtop_serviceAreaInner ul li:FIRST-CHILD {
    padding-left: 10px;
}

.gtop_serviceAreaInner ul li a img {
    width: 120px;
    height: 122px;
}

.android .gtop_serviceAreaInner ul li {
    display: inline-block;
    padding-left: 0px;
}

.android .gtop_serviceAreaInner ul li:FIRST-CHILD {
    padding-left: 0px;
}

/*
 ■■ インフォメーションエリア
========================================================= */
.gtop_newsAreaInner {
    width: 100%;
}

.newsType02 div span.titleArea {
    display:table-cell;
    vertical-align: top;
}
.newsType02 div span.iconArea {
    display:table-cell;
    width: 100px;
    vertical-align: top;
}
.newsType02 div{
    margin-top:10px;
    padding-bottom:10px;
    border-bottom: 1px solid #cfcfcf;
}

.newsType02 div .icon_information:BEFORE {
    content: "";
    display: block;
    width: 80px;
    height: 26px;
    background-image:  url("/mem/responsive/img/ktop_icon_information.png");
    background-size: 80px 26px;
    background-repeat: no-repeat;
}
.newsType02 .icon_maintenance {
    content: "";
    display: block;
    width: 80px;
    height: 26px;
    background-image:  url("/mem/responsive/img/ktop_icon_maintenance.png");
    background-size: 80px 26px;
    background-repeat: no-repeat;
}
.newsType02 .icon_security {
    content: "";
    display: block;
    width: 80px;
    height: 26px;
    background-image:  url("/mem/responsive/img/ktop_icon_security.png");
    background-size: 80px 26px;
    background-repeat: no-repeat;
}
.newsType02 .icon_service {
    content: "";
    display: block;
    width: 80px;
    height: 26px;
    background-image:  url("/mem/responsive/img/ktop_icon_service.png");
    background-size: 80px 26px;
    background-repeat: no-repeat;
}
.newsType02 .icon_other {
    content: "";
    display: block;
    width: 80px;
    height: 26px;
    background-image:  url("/mem/responsive/img/ktop_icon_other.png");
    background-size: 80px 26px;
    background-repeat: no-repeat;
}

/*
 ■■ 会員TOP用 carouselAreal
========================================================= */
.gtop_carouselWrapArea {
    background-color: #fafafa;
}
.carouselWrapArea {
    background-color: transparent;
    width: 100%;
} 
.carouselWrapArea.ktopCarousel .naviWrap .btnNext {
    border-right:none;
    background:#005135;
    width: 35px;
}   
.carouselWrapArea.ktopCarousel .naviWrap .btnNext:BEFORE {
    margin-top:-15px;
    margin-left:-6px;
    border: 16px solid transparent;
    border-left-color: #fff;
    border-right: none;
}
.carouselWrapArea.ktopCarousel .naviWrap .btnNext:AFTER {
    margin-top:-15px;
    margin-left:-7px;
    border: 16px solid transparent;
    border-left-color: #005135;
    border-right: none;
}

.carouselWrapArea.ktopCarousel .naviWrap .btnPrev{
    border-left:none;
    background: #005135;
    width: 35px;
}
.carouselWrapArea.ktopCarousel .naviWrap .btnPrev:BEFORE {
    margin-top:-15px;
    margin-left:-11px;
    border: 16px solid transparent;
    border-right-color: #fff;
    border-left: none;
}
.carouselWrapArea.ktopCarousel .naviWrap .btnPrev:AFTER {
    margin-top:-15px;
    margin-left:-10px;
    border: 16px solid transparent;
    border-right-color: #005135;
    border-left: none;
}

.slickSliderWrap{
    width: 100% !important;
}
.slickSliderContainer{
    width: 86%;
}
.slickSliderWrap .slickSliderContainer div.contents:nth-of-type(2n+1){
    text-align: right;
}
.slickSliderWrap .slickSliderContainer div.contents:nth-of-type(2n+1) div{
    margin-right: 20px;
}
.slickSliderWrap.SP_S .slickSliderContainer div.contents{
    text-align: center;
}
.slickSliderWrap.SP_S .slickSliderContainer div.contents div{
    margin-right: 20px;
}

/*
 ■■ 画像ズーム調整
========================================================= */
.zoom{
    position:relative;
    z-index:1;
}

/*
 ■■ ブランド訴求エリア
========================================================= */

.gtop_brandWrap{
    background:url(/responsive/img/index_brandBox_bg.png) no-repeat top center;
    height:560px;
    margin-top:10px;
}

.gtop_brandInner{
  width: 100%;
  margin-right: auto;
  margin-left: auto;
}

.gtop_brandWrap .message{
    height:137px;
    text-align:center;
    box-sizing:border-box;
    padding-top:30px;
    font-size:24px;
    font-weight:bold;
}

.gtop_brandBoxWrap{
  display:table;
  table-layout:fixed;
}

.gtop_brandBox{
    display:table-cell;
    padding:10px;
    text-align:center;
}
.gtop_brandBox .catch{
    margin-top:10px;
    font-weight:bold;
    padding-bottom:10px;
    border-bottom:1px solid #cfcfcf;
}
.gtop_brandBox .detail{
    margin-top:15px;
    text-align:left;
    font-size:12px;
}

/*
 ■■ お知らせエリア
========================================================= */

.gtop_infoAreaWrap{
    box-shadow: 0px -3px 3px rgba(0,0,0,0.1);
    padding-top:10px;
}
.gtop_infoAreaInner{
    width: 100%;
    margin-right: auto;
    margin-left: auto;
}

/* iPad (1024×728) margin delete
--------------------------------------------------------- */
@media only all and (device-width: 768px) and (orientation: portrait) {
  #wrapper {
    margin-right: 0;
    margin-left: 0;
  }
}

/* =========================================================
 ■ 02 コンテンツエリア
========================================================= */
/*
 ■■ 02-10 見出し
========================================================= */
/* 
 ■■■ 02-10-02 見出し02
--------------------------------------------------------- */
#contWrap h2 {
  font-size: 129%;
  font-weight: bold;
  color: #005135;
  margin: 20px 0 18px;
  position: relative;
  box-sizing: border-box;
}

#contWrap h2:before {
  content: " ";
  display: block;
  width: 100%;
  height: 1px;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #005135;
  position: absolute;
  bottom: -8px;
  left: 0;
  padding-right: 5px;
}

/*
 ■■ 02-20 テキスト重要度表現
========================================================= */
/*common.css内に記述*/
/* 
 ■■■ 02-20-05 テキスト重要度表現（標準）
--------------------------------------------------------- */
#contWrap p {
  margin-bottom: 10px;
  margin-top: 10px;
}


/* 
 ■■■ 02-60-01 テキストリンク
--------------------------------------------------------- */
.smallArrowLink{
  margin-top: 10px;
  margin-bottom: 10px;
}

.smallArrowLink > li {
  display: block;
  position: relative;
  padding-left: 15px;
  margin-bottom: 5px;
  background: url("/static/responsive/img/mem/common_pict_img_linkArrow02.png") no-repeat;
  background-position: 6px 3px;
}

/*
 ■■ 02-100 リンクアイコン
========================================================= */
/* 
 ■■■ 02-100-01 別ウィンドウアイコン
--------------------------------------------------------- */
.blankLink {
  position: relative !important;
  display: inline-block;
  text-indent: 0em;
}
.blankLink:before {
  display: inline-block;
  position: relative;
  top: 2px;
  left: 5px;
  content: "";
  width: 10px;
  height: 8px;
  border: #FFF solid 1px;
  background-color: #0C1E89;
}
.blankLink:after {
  display: inline-block;
  position: relative;
  top: -1px;
  left: -10px;
  content: "";
  width: 10px;
  height: 8px;
  border: #FFF solid 1px;
  background-color: #0C1E89;
}

a:hover .blankLink:before {
  opacity: 0.8;
  background-color: #717CB5 \9;
}
a:hover .blankLink:after {
  opacity: 0.8;
  background-color: #717CB5 \9;
}

/*
 ■■ 02-140 タブ
========================================================= */
/* 
 ■■■ 02-140-01 タブ数が少ない場合（SP時横並び）
--------------------------------------------------------- */
#contWrap .tabAreaWrap {
  margin-top: 15px;
  margin-bottom: 15px;
  position:relative;
}
#contWrap .tabAreaWrap .tabHead{
    position:relative;
    top:0
    left:0;
    z-index:10;
}
#contWrap .tabAreaWrap .tabHead ul {
    height:30px;
}
#contWrap .tabAreaWrap .tabHead ul li{
    width:230px;
    float:left;
    margin-left:10px;
    border-top:1px solid #cfcfcf;
    border-left:1px solid #cfcfcf;
    border-right:1px solid #cfcfcf;
    border-radius:0;
    background-color:#fafafa;
    padding:10px;
    text-align:center;
}
#contWrap .tabAreaWrap .tabHead ul li.act{
    background-color:#fff;
    border-bottom:1px solid #fff;
    
    border-left: 1px solid #cfcfcf;
    border-radius: 0;
    border-right: 1px solid #cfcfcf;
    border-top: 1px solid #cfcfcf;
    float: left;
    padding: 10px;
    text-align: center;
}
#contWrap .tabAreaWrap .tabHead ul li:hover{
    cursor:pointer;
}
#contWrap .tabAreaWrap .tabBody{
    border-color: #cfcfcf !important;
    border-style: solid !important;
    border-width: 1px !important;
    z-index:5;
    top:-1px;
    
    padding: 10px;
}

#contWrap .tabAreaWrap .tabBody dl{
    padding:0;
}
#contWrap .tabAreaWrap .tabBody dl dt{
    width:100%;
    float:none;
}
#contWrap .tabAreaWrap .tabBody dl dd{
    width:100%;
    float:none;
    margin-bottom:10px;
    margin-left: 10px;
}
#.tabAreaWrap .tabBody .smallArrowLink{
    clear:both;
    margin-left:80px;
}

/*
 ■■ 02-990 その他
========================================================= */
/* 
 ■■■ フォーム部品
--------------------------------------------------------- */
/* ----- 基本部品 ----- */
input[type=text]{
  background-color: #f8f8f8;
  border: 1px solid #c6c6c6;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 5px;
}

.custom-form-focused {
  background-position: -12px -123px;
}

/* fix select height bug on webkit browsers for Mac OS */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  select.cform {
    -webkit-appearance: menulist-button;
  }
}

/*
 ■■ マージン調整
========================================================= */
/* 
 ■■■ div td内の上部のマージン削除
--------------------------------------------------------- */
div p:first-child,
div ul:first-child,
div h1:first-child,
div h2:first-child,
div h3:first-child,
div h4:first-child,
div h5:first-child,
div h6:first-child,
div table:first-child,
td p:first-child,
div .set:first-child {
  margin-top: 0 !important;
}

.section h1:first-child,
.section h2:first-child,
.section h3:first-child {
  margin-top: 20px !important;
}

.irreTable .irreT_head h3 {
  margin-top: 0 !important;
}

.section h4:first-child,
.section h5:first-child,
.section h6:first-child {
  margin-top: 15px !important;
}

.tabBody .section:first-child h2:first-child {
  margin-top: 0 !important;
}

.tabBody .imageCutLeft:first-child {
  margin-top: 0 !important;
}

.tabBody .imageCutLeftType02:first-child {
  margin-top: 0 !important;
}

.tabBody .conversionArea:first-child {
  margin-top: 0 !important;
}

.colCL2Type01 h2:first-child,
.colCR2Type01 h2:first-child,
.colCL2Type02 h2:first-child,
.colCR2Type02 h2:first-child,
.colCL2Type03 h2:first-child,
.colCR2Type03 h2:first-child,
.colCL3Type01 h2:first-child,
.colCC3Type01 h2:first-child,
.colCR3Type01 h2:first-child,
.colCL4Type01 h2:first-child,
.colCC014Type01 h2:first-child,
.colCC024Type01 h2:first-child,
.colCR4Type01 h2:first-child,
.colCL4Type01 h2:first-child,
.colCR4Type02 h2:first-child,
.colCL4Type02 h2:first-child,
.colCR4Type01 h2:first-child,
.colCL2Type01 h3:first-child,
.colCR2Type01 h3:first-child,
.colCL2Type02 h3:first-child,
.colCR2Type02 h3:first-child,
.colCL2Type03 h3:first-child,
.colCR2Type03 h3:first-child,
.colCL3Type01 h3:first-child,
.colCC3Type01 h3:first-child,
.colCR3Type01 h3:first-child,
.colCL4Type01 h3:first-child,
.colCC014Type01 h3:first-child,
.colCC024Type01 h3:first-child,
.colCR4Type01 h3:first-child,
.colCL4Type01 h3:first-child,
.colCR4Type02 h3:first-child,
.colCL4Type02 h3:first-child,
.colCR4Type01 h3:first-child {
  margin-top: 0 !important;
}

/* 
 ■■■ ページ下部のマージン削除
--------------------------------------------------------- */
div p:last-child,
div ul:last-child,
div div:last-child,
div .txtBox:last-child,
div .conversionArea:last-child,
div .formBtnArea:last-child {
  margin-bottom: 0 !important;
}

.section p:last-child,
.section table:last-child,
.section div:last-child,
.section ul:last-child,
.section .liqW:last-child {
  margin-bottom: 0 !important;
}

ul li:last-child {
  margin-bottom: 0 !important;
}

td p:last-child,
td table:last-child,
td div:last-child,
td ul:last-child,
td .liqW:last-child {
  margin-bottom: 0 !important;
}

