@charset "UTF-8";
/* ====================================================
　CSS 3@ Document 2016.02.16
==================================================== */
/* ######################################################################################

　基本設定

###################################################################################### */


html{font-size:10px}


body {
    color: #333333;
    font-family:"メイリオ", "Meiryo", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
    font-size:1.2rem;
}

body.pageIndex,
body .header,
body .footer,
.footerMap,
.wallBelt.global,

.pageIndex section,
.pageIndex article,
.pageIndex aside,
.pageIndex div,
.pageIndex span,
.pageIndex p,
.pageIndex ul,
.pageIndex ol,
.pageIndex li,
.pageIndex dl,
.pageIndex dt,
.pageIndex dd,
.pageIndex table,
.pageIndex thead,
.pageIndex tbody,
.pageIndex tr,
.pageIndex th,
.pageIndex td,

.header section,
.header article,
.header aside,
.header div,
.header span,
.header p,
.header ul,
.header ol,
.header li,
.header dl,
.header dt,
.header dd,
.header table,
.header thead,
.header tbody,
.header tr,
.header th,
.header td,

.footer section,
.footer article,
.footer aside,
.footer div,
.footer span,
.footer p,
.footer ul,
.footer ol,
.footer li,
.footer dl,
.footer dt,
.footer dd,
.footer table,
.footer thead,
.footer tbody,
.footer tr,
.footer th,
.footer td,

.footerMap section,
.footerMap article,
.footerMap aside,
.footerMap div,
.footerMap span,
.footerMap p,
.footerMap ul,
.footerMap ol,
.footerMap li,
.footerMap dl,
.footerMap dt,
.footerMap dd,
.footerMap table,
.footerMap thead,
.footerMap tbody,
.footerMap tr,
.footerMap th,
.footerMap td,

.wallBelt.global section,
.wallBelt.global article,
.wallBelt.global aside,
.wallBelt.global div,
.wallBelt.global span,
.wallBelt.global p,
.wallBelt.global ul,
.wallBelt.global ol,
.wallBelt.global li,
.wallBelt.global dl,
.wallBelt.global dt,
.wallBelt.global dd,
.wallBelt.global table,
.wallBelt.global thead,
.wallBelt.global tbody,
.wallBelt.global tr,
.wallBelt.global th,
.wallBelt.global td　{font-size:1.4rem;}




p {margin: 0;}
a { color: #1457a0; }

@media print, screen and (min-width: 768px) {
    body {min-width: 1110px;}
    .header .contents,
    .wallBelt.global .contents,
    .footerMap .contents,
    .footer .contents,
    .surveyForm .contents,
    .contents{
        width: 1110px;
        padding: 0 15px;
        margin: 0 auto;
    }
    .contents.column2{padding: 0;}

#PageCatalogIndex .contents.column2,
#PageCatalog .contents.column2 {
    width:auto;
}


}
@media screen and (max-width: 767px) {
    .contents{padding: 0 15px;}
}


/* ######################################################################################

　枠設定

###################################################################################### */


/* ######################################################################################

　ヘッダー

###################################################################################### */
.header{background: #fff; text-align: left;}

@media print, screen and (min-width: 768px) {
    .header{border-top: 3px solid #5a8ede;}
    .header .logo{float: left; padding-top: 30px;}
}
@media screen and (max-width: 767px) {
    .header{
        height: 55px;
        border-bottom: 1px solid #1457a0;
        box-shadow: none;
    }
    .header .logo{padding-top: 17px; text-align: center;}
    .header .logo img{max-width: 131px; width: 100%; height: auto;}
}

/* ====================================================
  rightBox
==================================================== */
@media print, screen and (min-width: 768px) {
    .header .rightBox{float: right;}
    .header .rightBox ul{font-size: 0;}
    .header .rightBox li{display: inline-block; vertical-align: top;}
    .header .rightBox li.search {margin-right: 1em; margin-top: 4px;}
    .header .rightBox li.search input[type="text"],
    .header .rightBox li.search a{display: inline-block; vertical-align: top;}
    .header .rightBox li.search input[type="text"]{height: 18px;}
    .header .rightBox li.search a{margin-left: 0.5em; padding-top: 0;}
    .header .rightBox li.jp a,
    .header .rightBox li.en a{
        display: block;
        width: 64px;
        height: 24px;
        padding-top: 6px;
        text-align: center;
        font-size: 1.1rem;
        text-decoration: none;
    }
    .header .rightBox li.jp a{background: #5a8ede; color: #fff;}
    .header .rightBox li.en a{background: #f1f5f9; color: #949494;}
}
@media screen and (max-width: 767px) {
    .header .rightBox{display: none;}
}

/* ====================================================
  gnav
==================================================== */
@media print, screen and (min-width: 768px) {
    .header .gnav{
        display:flex;
        flex-wrap:wrap;
        clear: both;
        float: left;
        margin-left: 178px;
        margin-top: -14px;
        font-size: 0;
        width:calc(100% - 178px);
    }
    .header .gnav ul{
        display: inline-block;
        vertical-align: top;
        font-size: 0;
    }
    .header .gnav li,
    .header .gnav li a{
        font-family: "Noto Sans Japanese", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
        text-decoration: none;
        color: #111111;
    }
    .header .gnav li{display: inline-block; vertical-align: top;}
    .header .gnav ul.mainNavi {
        display:inline-flex;
        justify-content:space-between;
        width:calc(100% - 100px);
    }
    .header .gnav ul.mainNavi .largeNavi + .largeNavi {margin-left:0;}

    .header .gnav .mainNavi > li{padding-bottom: 24px;}
    .header .gnav .mainNavi li,
    .header .gnav .mainNavi li a{font-weight: bold; font-size: 1.4rem;}
    .header .gnav .mainNavi li + li{margin-left: 24px;}
    .header .gnav .mainNavi > li > a,
    .header .gnav .mainNavi > li > span{position: relative; padding: 10px 28px 12px 16px; cursor:default;}
    .header .gnav .mainNavi > li > a:hover,
    .header .gnav .mainNavi > li.appear > span{background: #1457a0; color: #fff;}
    .header .gnav .mainNavi li span{padding-right: 28px;}
    .header .gnav .mainNavi > li > a:before,
    .header .gnav .mainNavi > li > span:before{
        content: "";
        position: absolute;
        display: block;
    }
    .header .gnav .mainNavi li a:hover:before,
    .header .gnav .mainNavi li.appear span:before{
        bottom: -6px;
        left: 50%;
        transform: translateX(-50%);
        width: 11px;
        height: 6px;
        background: url(../img/header/gnavArrow.png);
    }
    .header .gnav .mainNavi > li > span:after,
    .header .gnav .mainNavi > li > a:after{
        content: "\f0d7";
        position: absolute;
        right: 13px;
        top: 16px;
        font-family: FontAwesome;
        font-size: 10px;
        color: #5a8ede;
    }
    .header .gnav .mainNavi li.appear span:after{color: #fff;}
    
    .header .gnav .subNavi{margin-left: 30px;}
    .header .gnav .subNavi li + li{
        margin-left: 1em;
        padding-left: 1em;
        border-left: 1px solid #acc6ee;
    }
    .header .gnav .subNavi li a{font-size: 1.1rem;}
}
@media screen and (max-width: 767px) {
    .header .gnav{display: none;}
}

/* largeNavi
-------------------------------------*/

@media print, screen and (min-width: 768px) {
    .largeNavi .largeMenu,
    .largeNavi .shortMenu{
        position: absolute;
        left: 0;
        top: 77px;
        display: none;
        width: 100%;
        max-height: 0;
        background-image: url(../img/header/largeMenu.png);
        background-position: center top;
        background-repeat: no-repeat;
        background-color: #d0e6f4;
        z-index: 10;
    }    
    .largeNavi.appear .largeMenu,
    .largeNavi.appear .shortMenu{
        display: block;
        transition-duration: 0.3s;
        transition-delay: 0.4s;
    }
    .largeNavi.appear .largeMenu{max-height:9999px; padding: 60px 0 30px;}
    .largeNavi .largeMenu .contents{
        display:flex;
        flex-wrap:wrap;
        align-content:flex-start;
        justify-content:flex-start;
        position: relative;
        font-size: 0;
    }
    .largeNavi .largeMenu h2,
    /*.largeNavi .largeMenu dl{display: inline-block; vertical-align: top;}*/
    .largeNavi .largeMenu h2{margin-bottom: 0;}
    .largeNavi .largeMenu .contents li{display: block;}
    .largeNavi .largeMenu .contents li + li{margin: 0; font-weight: normal;}
    .largeNavi .largeMenu .contents dt,
    .largeNavi .largeMenu .contents dd a,
    .largeNavi .largeMenu .contents a{
        font-family:"メイリオ", "Meiryo", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
    }
    .largeNavi .largeMenu .contents dt{margin-bottom: 8px; line-height: 1.7143;}
    .largeNavi .largeMenu .contents dd a{
        font-size: 1.2rem;
        line-height: 2;
        font-weight: normal;
    }
    .largeNavi .largeMenu .contents dd a:hover,
    .largeNavi .largeMenu .contents p a:hover{text-decoration: underline;}

    .largeNavi .largeMenu .contents li ul {display:block;}
    .largeNavi .largeMenu .contents .inline ul {
        display:flex;
        text-align:center;
        justify-content:center;
    }
    .largeNavi .largeMenu .contents .inline ul > li+li {margin-left:2em;}
    .largeNavi .largeMenu .contents li ul li {
        position:relative;
        margin-left:10px;
        padding-left:10px;
        margin-top:0;
    }
    .largeNavi .largeMenu .contents li ul li:before,
    .largeNavi .largeMenu .contents li ul li:after {
        content:"";
        display:inline-block;
        position:absolute;
        bottom:0;
        left:0;
        width:1px;
        height:100%;
    }
    .largeNavi .largeMenu .contents li ul li:before  {background:#e8f3fa; left:0;}
    .largeNavi .largeMenu .contents li ul li:after   {background:#95bae9; left:-1px;}
    .largeNavi .largeMenu .contents li ul a {line-height:1.5;}

    /* Line Up */
    .largeNavi .largeMenu dl {
        position:relative;
        padding-left: 13px;
        padding-right: 13px;
        font-size: 0;
    }
    .largeNavi .largeMenu dd{display: inline-block;}
    .largeNavi .largeMenu dl dd:not(:first-of-type){margin-left: 15px;}
    .largeNavi .largeMenu dl:not(:last-child):before,
    .largeNavi .largeMenu dl:not(:last-child):after {
        content:"";
        display:block;
        position:absolute;
        top:0;
        width:1px;
        height:100%;
    }
    .largeNavi .largeMenu dl:before {background:#e8f3fa; right:-1px;}
    .largeNavi .largeMenu dl:after  {background:#95bae9; right:0;}

    .largeNavi .largeMenu dl dt + dt,
    .largeNavi .largeMenu dl dd + dt {
        position:relative;
        padding-top:0.5em;
    }
    .largeNavi .largeMenu dl dd + dt {margin-top:0.5em;}


    .largeNavi .largeMenu dl dt + dt:before,
    .largeNavi .largeMenu dl dt + dt:after,
    .largeNavi .largeMenu dl dd + dt:before,
    .largeNavi .largeMenu dl dd + dt:after {
        content:"";
        display:block;
        position:absolute;
        left:0;
        width:100%;
        height:1px;
    }
    .largeNavi .largeMenu dl dt + dt:before,
    .largeNavi .largeMenu dl dd + dt:before {
        background: #e8f3fa;
        top: 0;
    }
    .largeNavi .largeMenu dl dt + dt:after,
    .largeNavi .largeMenu dl dd + dt:after {
        background: #95bae9;
        top: -1px;
    }





    .largeNavi.navi01 .largeMenu .lineUp04 {width: 220px; padding-left:0;}
    .largeNavi.navi01 .largeMenu .lineUp01 {width: 395px;}
    .largeNavi.navi01 .largeMenu .lineUp02 {width: 275px;}
    .largeNavi.navi01 .largeMenu .lineUp03 {width: 190px;}
    
    .largeNavi.navi01 .largeMenu .lineUp03 p {position: absolute; margin-top: 13px; padding-top: 0.5em;}
    .largeNavi.navi01 .largeMenu .lineUp03 p:before,
    .largeNavi.navi01 .largeMenu .lineUp03 p:after{
        content: "";
        position: absolute;
        top: 0;
        left: -10px;
        display: block;
        width: 180px;
        height: 1px;
        background:#95bae9;
    }
    .largeNavi.navi01 .largeMenu .lineUp03 p:after{background:#e8f3fa; top: -1px;}
    .largeNavi.navi01 .largeMenu .lineUp03 p a{font-weight: bold;}

/*
    .largeNavi.navi02.appear .largeMenu{height: 180px;}
    .largeNavi.navi03.appear .largeMenu{height: 170px;}
*/

    .largeNavi.navi03 .lineUpTitle,
    .largeNavi.navi03 .topics,
    .largeNavi.navi03 dl,
    .largeNavi.navi03 ul{display: inline-block; height: 125px; vertical-align: top;}
    .largeNavi.navi03 .topics,
    .largeNavi.navi03 dl,
    .largeNavi.navi03 .mainmenu{padding: 0 2.5rem;}
    .largeNavi.navi03 dt a:hover,
    .largeNavi.navi03 li a:hover{text-decoration: underline;}
    
    
    .largeNavi.navi03 .topics{
        position: relative;
        font-family: "メイリオ", "Meiryo", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
    }
    .largeNavi.navi03 .topics:before,
    .largeNavi.navi03 .topics:after,
    .largeNavi.navi03 .mainmenu li:before,
    .largeNavi.navi03 .mainmenu li:after{
        content:"";
        display:block;
        position:absolute;
        top:0;
    }
    .largeNavi.navi03 .topics:before,
    .largeNavi.navi03 .topics:after{width:1px; height:100%;}

    .largeNavi.navi03 .topics:before{background:#e8f3fa; right:-1px;}
    .largeNavi.navi03 .topics:after{background:#95bae9; right:0;}
    
    .largeNavi.navi03 .mainmenu li:before {background:#e8f3fa; top:-1px;}
    .largeNavi.navi03 .mainmenu li:after {background:#95bae9; top:0;}
    
    .largeNavi.navi03 .mainmenu li + li:before,
    .largeNavi.navi03 .mainmenu li + li:after{width: 100%; height: 1px;}
    .largeNavi.navi03 .mainmenu li{position: relative;}
    .largeNavi.navi03 .mainmenu li + li{margin-top: 0.5em; padding-top: 0.5em;}

    .largeNavi .largeMenu .menuClose{
        position: absolute;
        right: -21px;
        top: 0;
        width: 26px;
        height: 26px;
        text-indent: -9999px;
        background-image: url(../img/header/closeButton.png);
    }
    
    .largeNavi.appear .shortMenu{min-height: 95px; padding: 1.5em 0;}
    .largeNavi.appear .shortMenu dt{margin-bottom: 0.75em;}
    .largeNavi.appear .shortMenu dd a{
        font-weight: normal;
        font-size: 1.2rem;
        font-family:"メイリオ", "Meiryo", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
    }
    .largeNavi.appear .shortMenu dd a:hover{text-decoration: underline;}   
}

/* =======================================================
	パンくずリスト　topicPath
========================================================== */
.topicPath {
  clear: both;
  line-height: 1;
  margin: 0 auto;
}
.topicPath ol {
  width: 100%;
  max-width: 900px;
  display: block;
  text-align: left;
}
.topicPath ol li {
  display: inline-block;
  font-size: 12px;
}
.topicPath ol li:before {
  content: ">";
  display: inline-block;
  padding: 0 0.5em;
}
.topicPath ol li:first-child:before {
  display: none;
}
.topicPath ol li a {
  color: #2666C6;
  text-decoration: underline;
}

@media screen and (min-width: 768px) {
  .topicPath {
    display: block;
    box-shadow: 0px 12px 12px 0px #f5f5f5;
  }
  .topicPath ol {
    margin: 0 auto;
  }
  .topicPath ol li a:hover {
    text-decoration: underline;
  }
}
@media screen and (max-width: 767px) {
  .topiPath {
    display: none;
    padding: 0 15px;
  }
}
.topicPath {
  position: relative;
  background: url(../../common_res/img/header/wall-header.png) bottom repeat-x;
  padding: 5px 0 11px;
}
.topicPath ol li {
  position: relative;
  font-size: 10px;
}
.topicPath ol:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 12px;
  background: url(../../common_res/img/header/wall-text_top.png);
}
@media screen and (max-width: 767px) {
  .topicPath {
    display: none;
  }
}


/* ######################################################################################

　サイドカラム

###################################################################################### */

.subColumn .archiveBox, #Sub .archiveBox li a{font-size: 12px;}
.category18 .wallBelt.first{padding-top: 65px !important;}
.category18 .contentsBox.item ul li span,
.category18 .contentsBox.item ul li a{font-size: 0 !important;}




/* ######################################################################################

　ページトップ

###################################################################################### */

@media print, screen and (min-width: 768px) {
    .wallBelt.pageTop{display: none;}
}
@media screen and (max-width: 767px) {
    .wallBelt.pageTop{
        width: 100%;
        padding: 11px 0 15px;
        border: none;
        border-top: 1px solid #5a8ede;
        border-bottom: 4px solid #5a8ede;
        text-align: center;
        font-size: 1.3rem;
        font-weight: bold;
    }
    .wallBelt.pageTop:before{
        content: "\f106";
        position: relative;
        top: 2px;
        display: inline-block;
        margin-right: 9px;
        font-family: FontAwesome;
        color: #5a8ede;
        font-size: 2rem;
    }
}


/* ######################################################################################

　フッター上サイトマップ

###################################################################################### */

@media print, screen and (min-width: 768px) {
    .footerMap {padding-top: 84px; padding-bottom: 62px; text-align: left;}
    .footerMap .contents{
        display:flex;
        justify-content:space-between;
        flex-wrap:wrap;
        position: relative;
     }
    .footerMap .contents:after{
        content: "";
        right: 135px;
        bottom: 1px;
        display: block;
        margin-top:20px;
        width:100%;
        height: 22px;
        background: url(../img/footer/footerlogo.png) right no-repeat;
    }
    .footerMap .sitemap{width: 220px;}
    .footerMap .sitemap:nth-child(n+5) {margin-top:34px;}

    /*
    .footerMap .sitemap01 dl + dl{margin-top: 34px;}
    .footerMap .sitemap02 dl + dl{margin-top: 34px;}
    .footerMap .sitemap03 dl + dl{margin-top: 57px;}
    */

    .footerMap dt,
    .footerMap p.topics{
        margin-bottom: 9px;
        padding-bottom: 10px;
        border-bottom: 1px solid #b5b7b9;
        color: #1457a0;
        font-size: 1.5rem;
        font-weight: bold;
    }
.footerMap dt a{text-decoration: none; color:#1457a0;}
    .footerMap dt a:hover{text-decoration: underline;}
    .footerMap p.topics{margin-top: 48px; line-height: 1.75;}
    .footerMap p.topics a{text-decoration: none;}
    .footerMap p.topics a:hover{text-decoration: underline;}
    
    .footerMap dd li span,
    .footerMap dd li a{
        font-size: 1.2rem;
        line-height: 2;
        text-decoration: none;
        color: #666666;
    }
    .footerMap dd li a:hover{text-decoration: underline;}
    .footerMap dd li span {opacity:0.3;}
    
}
@media screen and (max-width: 767px) {
    .footerMap{display: none;}
}

/* ######################################################################################

　go to global site

###################################################################################### */

@media print, screen and (min-width: 768px) {
    .wallBelt.global{
        padding: 6px 0 7px;
        background: #3c3f49;
        text-align: right;
    }
    .wallBelt.global .contents{text-align: right;}
    .wallBelt.global span,
    .wallBelt.global a{
        position: relative;
        padding-left: 23px;
        color: #fff;
        text-decoration: none;
        font-size: 1.3rem;
    }
    .wallBelt.global * + span,
    .wallBelt.global * + a {margin-left:1em;}

    .wallBelt.global a:hover{text-decoration: underline;}
    .wallBelt.global a:before{
        content: "";
        position: absolute;
        left: 0;
        top: 2px;
        display: block;
        width: 15px;
        height: 15px;
        background: url(../img/footer/earth.png);
    }
    .wallBelt.global span {opacity:0.3;}
}
@media screen and (max-width: 767px) {
    .wallBelt.global{display: none;}
}



/* ######################################################################################

　フッター

###################################################################################### */
.footer{background: #1f2024; text-align: left;}
.footerNavi li a{text-decoration: none;}

@media print, screen and (min-width: 768px) {
    .footer {padding-top: 36px; padding-bottom: 57px;}
    
    .footer .footerMenu{display: none;}
    
    .footerNavi{margin-bottom: 1.4rem; font-size: 0;}
    .footerNavi li{
        position: relative;
        display: inline-block;
        margin-right: 17px;
        vertical-align: top;
    }
    .footerNavi li + li{margin-left: 17px;}
    .footerNavi li + li:after{
        content: "";
        position: absolute;
        left: -17px;
        top: 2px;
        display: block;
        width: 1px;
        height: 13px;
        background: #f2f2f2;
    }
    .footerNavi li a{color: #f2f2f2; font-size: 1.2rem;}
    .footerNavi li a:hover{text-decoration: underline;}
    
    .footer .copyright{color: #7c7c7c; font-size: 1.2rem;}
}
@media screen and (max-width: 767px) {
    .footer{ text-align: left;}
    .footer {text-align: left;}
    .footerMenu{margin: 0 -15px;}
    .footerMenu.comp{margin: 0; background: #1f2024;}
    .footerMenu li{position: relative;}
    .footerMenu li > ul{display: none;}
    .footerMenu li span,
    .footerMenu li a{
        display: block;
        margin: 0;
        padding: 17px 20px 16px;
        border-bottom: 1px solid #3b3c40;
        font-size: 1.4rem;
        color: #fff;
        text-decoration: none;
    }
    .footerMenu li span:before,
    .footerMenu li a:before{
        content: "\f105";
        display: inline-block;
        margin-right: 7px;
        font-family: FontAwesome;
    }
    
    .footerMenu li.downmenu a,
    .footerMenu li.downmenu span {font-weight: bold;}
    .footerMenu li.downmenu > span:before,
    .footerMenu li.downmenu > a:before{display: none;}

    .footerMenu > ul > li > a {font-weight:bold;}
    .footerMenu > ul > li > a:before {display:none;}

   
    /* 子要素
    -------------------------------------*/
    .footerMenu li.downmenu li span,
    .footerMenu li.downmenu li a{
        
        background: #333;
        border-top: 1px solid rgba(255, 255, 255, 0.25);
        color: #ccc;
        font-weight: normal;
    }
    .footerMenu li.downmenu li span {padding: 1em 0 1em 1em; color:#ffffff; font-weight:bold;}
    .footerMenu li.downmenu li a    {padding: 0.75em 0 0.75em 1em;}

    .footerMenu li.downmenu li li span {padding-left:2em;}
    .footerMenu li.downmenu li li a    {padding-left:2em;}

    .footerMenu li.downmenu li li li span {padding-left:3em;}
    .footerMenu li.downmenu li li li a    {padding-left:3em;}
    
    
    .footerMenu li .downButton{
        content: ""; 
        box-sizing: border-box;
        position: absolute;
        top: 0;
        right: 0px;
        z-index: 2;
        width: 100%;
        height: 49px;
        border: none !important;
        cursor: pointer;
    }
    .footerMenu li .downButton:before,
    .footerMenu li .downButton:after{
        content: "";
        display: block;
        position: absolute;
        top:16px;
        right:20px;
        width: 3px;
        height: 15px;
        background: #fff;
    }
    .footerMenu li .downButton:before{transform: rotate(90deg);}
    .footerMenu li .downButton:after{}
    .footerMenu li .downButton.open:after{display: none;}
    
    
    
    .footerNavi{margin-top: 26px;}
    .footerNavi li + li{margin-top: 15px;}
    .footerNavi li a{
        color: #cccccc;
        font-size: 1.2rem;
    }
    
    .footer .copyright{
        display: block;
        margin: 22px -15px 0;
        border-top: 1px solid #3b3c40;
        padding: 24px 0 23px;
        color: #ffffff;
        font-size: 1rem;
        text-align: center;
    }
    
}

@media print, screen and (min-width: 768px) {
    .sp{display: none;}
}
@media screen and (max-width: 767px) {
    .pc{display: none;}
}



/* ====================================================
    アンケートにご協力ください
==================================================== */
.surveyForm{
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: rgba(31,76,170,0.8);
    padding: 1.5em;
    z-index: 7999;
}

.surveyForm .contents{position: relative;}
.surveyForm .close{
    position: absolute;
    top: 0px;
    right: 15px;
    display: block;
    width: 38px;
    height: 38px;
    background: #fff;
    border-radius: 1px;
    cursor: pointer;
}
.surveyForm .close:before{
    content: "×";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #4067b7;
    font-size: 22px;
    line-height: 1;
}

.surveyForm h3,
.surveyForm p{color: #fff; text-align: center; padding: 0 60px;}

.surveyForm h3{margin-bottom: 0.5em; font-size: 16px; font-weight: bold;}
.surveyForm p{margin-bottom: 1em; font-size: 12px;}

.surveyForm .button{
    position: relative;
    display: block;
    width: 260px;
    margin-left: auto;
    margin-right: auto;
    padding: 1.25em;
    background: #000;
    color: #fff;
    font-size: 14px;
}
.surveyForm .button:after{
    content: "";
    position: absolute;
    top: 50%;
    right: 1.5em;
    width: 9px;
    height: 9px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    transform: rotate(45deg) translateY(-50%);
   
}
.surveyForm .button:hover{text-decoration: none;}


@media screen and (max-width: 767px) {
    .surveyForm{padding: 2.5em 1em 2em;}
    .surveyForm .close{
        right: -1em;
        top: -2.5em;
        width: 26px;
        height: 26px;
    }
    .surveyForm .contents{padding: 0;}
    .surveyForm h3, .surveyForm p{padding: 0;}
    .surveyForm .close:before{font-size: 18px;}
}


/* end */