@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Roboto:400,700');

*, *:before, *:after {
    -webkit-box-sizing: border-box!important;
       -moz-box-sizing: border-box!important;
         -o-box-sizing: border-box!important;
        -ms-box-sizing: border-box!important;
            box-sizing: border-box!important;
}

body {
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-variant-ligatures: none;
	color: #333333;
	-webkit-text-size-adjust: 100%;
}
html, body {
	height: 100%;
	font-size: 10px;
}

#topicsArea a:hover,
#company a:hover {
  text-decoration: underline!important;
}

a {
  transition: 0.5s;
}
a img {
  transition: 0.5s;
}
a:hover img {
  opacity: 0.6;
}
a.hoverUL:hover {
  text-decoration: underline;
}


br.pc {display: block;}
br.sp {display: none;}
@media screen and (max-width: 768px) {
  br.pc {display: none;}
  br.sp {display: block;}
}


/*---------------------------------------------------
	共通
---------------------------------------------------*/
header,
footer,
.secBox {
  width: 1030px;
  margin: 0 auto!important;
}

section {
  padding: 60px 0;
  line-height: 1.8;
}
/* 下層ページsection */
#second section {
  padding: 15px 0 40px;
  border-top: 1px solid #dedede;
  border-bottom: 1px solid #dedede;
}

h2 {
  font-family: 'Roboto', sans-serif, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic";
  font-weight: 700!important;
  font-size: 3.2em;
  line-height: 1;
  margin-bottom: 30px!important;
}
h2 span {
  font-size: 15px;
  color: #979899;
  margin-left: 7px;
  vertical-align: middle;
}

h3 {
  font-size: 2.3em;
  font-weight: bold!important;
  margin-bottom: 20px!important;
}

.col-L,
.col-R {
  display: table-cell;
  width: 50%;
}
.col-R {
  text-align: right;
}

/* ページトップ */
.pagetop a {
  bottom: 50px;
  display: block;
  position: fixed;
  right: 30px;
  z-index: 10;
}

/* 下層パンくずリスト */
.breadcrumb {
  font-size: 1.4em;
  margin-bottom: 35px;
}
.breadcrumb i {
  margin: 0 7px;
  color: #a7a7a7;
}


/*---------------------------------------------------
	header
---------------------------------------------------*/
header.sp_menu {
  display: none;
}
header.pc_menu {
  /*height: 70px;*/
  display: table!important;
}
header.pc_menu  .col-L,
header.pc_menu  .col-R {
  height: 70px;
  vertical-align: middle;
}
header.pc_menu  .col-R .nav,
header.pc_menu  .col-R img {
  display: inline-block;
}

header.pc_menu  .col-R .nav li {
  text-align: center;
  display: inline-block;
}

header.pc_menu  .col-R img {
  margin: 15px 0 15px 20px;
}


/*---------------------------------------------------
	footer
---------------------------------------------------*/
footer {
  padding: 20px 0!important;
  display: table!important;
}
footer .col-L .nav {
  margin-left: -15px;
  height: 64px;
}
footer .col-L .nav li {
  text-align: center;
  display: inline-block;
}
footer .col-L .nav li a {
  font-size: 1.5em;
  display: block;
  padding: 0 15px;
}
footer .col-L h1 {
  padding: 10px 0;
}
footer .col-R {
  vertical-align: bottom;
}

.copy {
  font-family: 'Roboto', sans-serif, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic";
  color: #8f8f8f;
}




/*---------------------------------------------------
	ナビゲーション
---------------------------------------------------*/
.nav,
.nav li,
.nav li a {
  height: 100%;
}
.nav li a {
  font-size: 1.5em;
  display: block;
  padding: 0 13px;
  line-height: 70px;
  position: relative;
  transition: .3s;
}
.nav li a:hover {
	text-decoration: none;
  background: #fff;
}
footer .nav li a:hover {
	text-decoration: underline!important;
}

.nav li a:before {
	content: '';
	width: 0;
	left: 50%;
	bottom: 2px;
	transition: all 0.3s ease;
	border-bottom: 3px solid #093c87;
	position: absolute;
	display: block;
}

header .nav li a:hover:before {
	width: 50%;
	border-bottom: 3px solid #093c87;
}
header .nav li a:after {
	content: '';
	width: 0;
	right: 50%;
	bottom: 2px;
	transition: all 0.3s ease;
	border-bottom: 3px solid #093c87;
	position: absolute;
	display: block;
}
header .nav li a:hover:after {
	width: 50%;
	border-bottom: 3px solid #093c87;
}

/*---------------------------------------------------
	mv
---------------------------------------------------*/
.swiper-slide {
  height: 600px!important;
  overflow:auto;
  background-size: cover!important;
}
.swiper-slide-bg {
  height: 600px!important;
  overflow:auto;
  background-size: contain!important;
}
.swiper-slide:nth-child(1) {background: url("../img/slider01-bg.jpg") no-repeat center center;}
.swiper-slide:nth-child(2) {background: url("../img/slider02-bg.jpg") no-repeat center center;}
.swiper-slide:nth-child(3) .swiper-slide-bg {background: url("../img/slider03-bg.jpg") no-repeat center center;}

@media screen and (min-width: 1500px) {
  .swiper-slide:after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background-size: cover!important;
    -ms-filter: blur(10px);
    filter: blur(10px);
    opacity: 0.3;
    z-index: -1;
  }
  .swiper-slide:nth-child(3):after {
    background: url("../img/slider03-bg.jpg") no-repeat center center;
  }
}

/* スライダー内コンテンツ */
.swiper-slide:nth-child(1) .swiper-slide-box {
  padding: 105px 0 0 0px;
}
.swiper-slide:nth-child(1)	.swiper-slide-box a {
  border: 2px solid #fff;
  color: #fff;
}

.swiper-slide:nth-child(2) .swiper-slide-box {
  padding: 150px 0 0 515px;
}
.swiper-slide:nth-child(2)	.swiper-slide-box a {
  background: #fff;
  color: #fc731c;
}

.swiper-slide	.swiper-slide-box {
  text-align: center;
  width: 1030px;
  margin: auto;
}
.swiper-slide	.swiper-slide-box img {
  margin: 0 0 60px;
}
.swiper-slide	.swiper-slide-box a {
  font-size: 1.8em;
  font-weight: bold;
  width: 260px;
  display: block;
  padding: 15px;
  margin: auto;
  position: relative;
}
.swiper-slide	.swiper-slide-box a i {
  font-size: 1.2em;
  position: absolute;
  right: 15px;
  top: 18px;
}

.swiper-slide > a {
  display: block;
  height: 100%;
}

@media screen and (min-width: 769px) {
  .swiper-slide:nth-child(1)	.swiper-slide-box a:hover {
    border: 2px solid #454b3b;
    background: #454b3b;
  }
  .swiper-slide:nth-child(2)	.swiper-slide-box a:hover {
    background: #6e4f3b;
    color: #fff;
  }
}


/* スライダー調整用 */
.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
    bottom: 30px!important;
}
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 8px!important;
}
.swiper-pagination-bullet {
  width: 12px!important;
  height: 12px!important;
  border: 2px solid #fff;
  background-color: rgba(0,0,0,0)!important;
  opacity: 1!important;
}
.swiper-pagination-bullet-active {
  background: #fff!important;
}


/*---------------------------------------------------
	トピックス
---------------------------------------------------*/
#topics h2,
#list h2,
#detail h2 {
  margin-bottom: 40px!important;
}
#topicsArea li {
  border-bottom: 1px solid #dedede;
  margin-bottom: 15px;
  padding-bottom: 15px;
}
#topicsArea li a {
  display: inline-block;
}
#topicsArea li span,
#topicsArea .detailDate span {
  font-size: 1.2em;
}
#topicsArea li p {
  font-size: 1.5em;
  margin-top: 12px;
}

#topicsArea li span#category_name,
#topicsArea .detailDate span#category_name {
  color: #fff;
  line-height: 1;
  display: inline-block;
  padding: 6px 15px;
  margin: 0 5px 0 10px; 
  border-radius: 20px;
}
#topics_new {
  line-height: 1;
  margin: 0 5px 0 10px;
}
#topics_new img {
  width: 50px;
}

#topicsArea li span.cateRed, #topicsArea .detailDate span.cateRed {background: #d90d0d;} /*カテゴリーが「重要なお知らせ」の時*/
#topicsArea li span.cateOrange, #topicsArea .detailDate span.cateOrange {background: #ec691b;} /*カテゴリーが「ニュース」の時*/
#topicsArea li span.cateYellow, #topicsArea .detailDate span.cateYellow {background: #e0bb2f;} /*カテゴリーが「キャンペーン」の時*/
#topicsArea li span.cateBlue, #topicsArea .detailDate span.cateBlue {background: #093c87;} /*カテゴリーが「サービス」の時*/
#topicsArea li span.cateGrey, #topicsArea .detailDate span.cateGrey {background: #9eaabc;} /*カテゴリーが「その他」の時*/

.listBtn {
  text-align: center;
  margin-top: 30px;
}
#detail .listBtn {
  text-align: left;
}
.listBtn a {
  font-size: 1.5em;
  display: inline-block;
  margin: auto;
  padding: 10px 25px;
  border: 2px solid #bdc5d1;;
  border-radius: 30px;
  transition: 0.5s;
}
.listBtn a:before {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  background: url("../img/btn-right_icon.png") no-repeat center center;
  background-size: cover;
  margin-right: 15px;
  transition: 0.5s;
}
@media screen and (min-width: 769px) {
  .listBtn a:hover {
    background: #093c87;
    border: 2px solid #093c87;
    color: #fff;
  }
  .listBtn a:hover:before {
    background: url("../img/btn-right_icon_on.png") no-repeat center center;
    background-size: cover;
  }
}
  
/* トピックス一覧 */
#topics_paging {
  text-align: center;
  margin-top: 30px;
}
#topics_paging li {
  font-size: 1.5em;
  text-align: center;
  line-height: 1;
  color: #909090!important;
  border: 1px solid #dee2e8;
  border-radius: 44px;
  width: 100px;
  padding: 14px 0;
  margin: 0 10px;
  display: inline-block;
}
#topics_paging li.pageOn {
  border: 1px solid #bdc5d1;
  padding: 0;
}
#topics_paging li.pageOn a {
  display: block;
  border-radius: 44px;
  padding: 14px 0;
}
#topics_paging li.pageOn a:hover {
  background: #093c87;
  color: #fff;
}


/* トピックス詳細 */
section#detail {
  padding-bottom: 60px!important;
}
h3#topics_title {
  font-size: 2.4em;
  font-weight: bold!important;
  line-height: 1.3;
  border-bottom: 1px solid #dedede;
  margin: 12px 0 40px!important;
  padding-bottom: 15px;
}
#topics_body {
  font-size: 1.4em;
}
#topics_body img {
  max-width: 100%;
  margin: 15px 0;
}

/*---------------------------------------------------
	トップ　サービス
---------------------------------------------------*/
#service {
  background: #eef0f3;
}
#service ul {
  overflow: hidden;
}
#service ul li {
  width: 495px;
  margin-right: 40px;
  float: left;
}
#service ul li:nth-child(2n) {
  margin-right: 0;
}
#service ul li:nth-child(n+3) {
  margin-top: 40px;
}


/*---------------------------------------------------
	トップ　会社概要
---------------------------------------------------*/
#company table {
  font-size: 1.5em;
}
#company table th,
#company table td {
  padding: 20px 0;
  border-bottom: 1px solid #dedede;
}
#company table th {
  width: 150px;
  text-align: left;
  font-weight: bold;
  vertical-align: top;
}

#company table tr:last-child th,
#company table tr:last-child td {
  border-bottom-width: 0;
}

/*---------------------------------------------------
	トップ　お問い合わせ
---------------------------------------------------*/
#contact {
  background: #eef0f3;
}
#contact table {
  font-size: 1.5em;
  background: #fff;
  border-radius: 5px;
  margin-bottom: 30px;
}
#contact table th,
#contact table td {
  padding: 20px 0;
}
#contact table td {
  padding-right: 30px;
}
#contact table th {
  width: 150px;
  vertical-align: top;
  font-weight: bold;
  text-align: left;
  padding-left: 30px;
}

#contact table:last-child {
  margin-bottom: 0;
}

#contact a.gmapLink {
  font-size: 14px;
  color: #67bbef;
  text-decoration: underline;
  display: inline-block;
  margin-left: 20px;
}
#contact a.gmapLink:hover {
  text-decoration: none;
}
#contact a.gmapLink img {
  vertical-align: middle;
  margin-left: 10px;
}


/*---------------------------------------------------
	下層ページ　プライバシーポリシー
---------------------------------------------------*/
#second #policy {
  padding: 15px 0 70px;
  text-align: justify;
}

#policy p,
#policy dl,
#policy ul {
  font-size: 1.4em;
  margin-bottom: 20px;
}
#policy p:last-child {
  margin-bottom: 0;
}

#policy dl dt {
  font-weight: bold;
}
#policy dl dd {
  margin-bottom: 20px;
}
#policy ul li {
  list-style: disc;
  list-style-position: inside;
}

.policyBox {
  margin-bottom: 75px;
}
.policyBox:first-of-type {
  margin-top: 65px;
}
.policyBox:last-of-type {
  margin-bottom: 0;
}





/*===========================================================================================================
=============================================================================================================
=============================================================================================================
=============================================================================================================
SP
=============================================================================================================
=============================================================================================================
=============================================================================================================
===========================================================================================================*/
@media screen and (max-width: 768px) {

/*---------------------------------------------------
	共通
---------------------------------------------------*/
  header,
  footer,
  .secBox {
    width: 100%;
    margin: 0 auto!important;
  }
  header:first-of-type {
  }
  header.sp_menu {
    display: block;
  }

  section {
    padding: 30px 15px!important;
  }

  
  /* 下層ページsection */
  #second section {
    padding-top: 59px!important;
    position: relative;
    border-top-width: 0;
    border-bottom: 1px solid #dedede;
  }

  h2 {
    font-size: 2.8em;
    margin-bottom: 20px!important;
  }
  h2 span {
    font-size: 13px;
  }

  h3 {
    font-size: 1.8em;
    margin-bottom: 25px!important;
  }
  
  a {
    transition: 0s;
  }
  a img {
    transition: 0s;
  }
  a:hover img {
    opacity: 1;
  }
  
  /* ページトップ */
  .pagetop a {
    right: 15px;
    top: 20px;
    position: absolute;
  }

  /* 下層パンくずリスト */
  .breadcrumb {
    font-size: 1.4em;
    margin-bottom: 25px;
  }
  .breadcrumb i {
    margin: 0 7px;
    color: #a7a7a7;
  }

/*---------------------------------------------------
	header
---------------------------------------------------*/
  header.pc_menu {
    display: none!important;
  }
  header.sp_menu {
    height: 45px;
    background: rgba(255,255,255,0.9);
    position: fixed;
    top: 0;
    z-index: 10;
    border-bottom: 1px solid #dedede;
  }
  header.sp_menu h1 {
    display: table;
    width: auto;
    height: 100%;
    padding-left: 10px;
  }
  header.sp_menu h1 a {
    display: table-cell;
    vertical-align: middle;
  }
  header.sp_menu h1 img {
    width: auto;
    height: 23px;
    vertical-align: middle;
  }
  
/* メニューボタン */
  .button {
      position: absolute;
      right: 0;
      top: 0;
    padding: 10px;
      width: 48px;
      height: 48px;
      z-index: 1000000;
      cursor: pointer;
      outline: none;
      -webkit-transition: .2s;
      transition: .2s;
      -webkit-transform: translate(0, 0);
      transform: translate(0, 0);
  }
  .bar {
      display: block;
      position: absolute;
      top: 23px;
      right: 0;
      left: 0;
      width: 28px;
      height: 3px;
      margin: auto;
      background: #9eaabc;
  }
  .bar:before, .bar:after {
      content: "";
      display: block;
      position: absolute;
      right: 0;
      left: 0;
      width: 28px;
      height: 3px;
      margin: auto;
      background: #9eaabc;
  }
  .bar:before {
      top: -8px;
  }
  .bar:after {
      top: 8px;
  }


/*---------------------------------------------------
	footer
---------------------------------------------------*/
  footer {
    position: relative;
    padding: 15px!important;
    display: block!important;
  }
  footer .col-L,
  footer .col-R {
    display: block;
    width: 100%;
  }
  footer .col-L .nav {
    margin-left: -15px;
    height: auto;
  }
  footer .col-L .nav li,
  footer .col-L .nav li a {
    height: auto;
  }
  footer .col-L .nav li a {
    font-size: 1.3em;
    padding: 7px 15px 7px;
    line-height: 1;
  }
  footer .col-L h1 {
    line-height: 1;
    width: 255px;
    margin: auto;
    padding: 20px 0 10px;
  }

  .copy {
    text-align: center;
    padding-bottom: 5px;
  }



/*---------------------------------------------------
	ドロワーメニュー
---------------------------------------------------*/
  #sb-site {
    background: #fff;
  }
  .sb-slidebar{
    background: #eef0f3;
    padding: 30px 18px 18px!important;
  }
  .sb-slidebar img {
    margin: 0 auto 30px;
    display: block;
  }
  .sb-slidebar ul li {
    position: relative;
    border-bottom: 1px solid #d1d7e1;
    padding: 0 5px 13px 5px;
    margin-bottom: 13px;
  }
  .sb-slidebar ul li  i{
    position: absolute;
    color: #c2cbd9;
    font-size: 1.8em;
    right: 0;
    top: 0;
  }
  .sb-slidebar ul li a {
    font-size: 1.4em;
  }


/*---------------------------------------------------
	mv
---------------------------------------------------*/
  .swiper {
    padding-top: 45px!important;
  }
  .swiper-slide,.swiper-slide-bg {
    height: 375px!important;
    overflow:hidden;
    display: table!important;
  }
  .swiper-slide:nth-child(1) {background: url("../img/slider01-bg_sp.jpg") no-repeat center center;}
  .swiper-slide:nth-child(2) {background: url("../img/slider02-bg_sp.jpg") no-repeat center center;}
  .swiper-slide:nth-child(3) {background: url("../img/slider03-bg_sp.jpg") no-repeat center center;}

  /* スライダー内コンテンツ */
  .swiper-slide:nth-child(1)	.swiper-slide-box {
    padding: 0 60px;
  }
  .swiper-slide:nth-child(1)	.swiper-slide-box p {
    display: none;
  }
  .swiper-slide:nth-child(2) .swiper-slide-box {
    padding: 0 30px;
  }

  .swiper-slide	.swiper-slide-box {
    text-align: center;
    width: 100%;
    margin: 0;
    padding: 0;
    display: table-cell;
    vertical-align: middle;
  }
  .swiper-slide	.swiper-slide-box img {
    margin: 0 0 20px;
  }
  .swiper-slide	.swiper-slide-box a {
    font-size: 1.5em;
    width: 80%;
    padding: 10px;
  }
  .swiper-slide	.swiper-slide-box a i {
    font-size: 1.2em;
    right: 5px;
    top: 27%;
  }

  /* スライダー調整用 */
  .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
    bottom: 14px!important;
  }

/*---------------------------------------------------
	トピックス
---------------------------------------------------*/
  #topics h2 {
    margin-bottom: 18px!important;
  }
  #list h2,
  #detail h2 {
    margin-bottom: 35px!important;
  }

  section#list,
  section#detail {
    padding-bottom: 40px!important;
  }

  .listBtn a {
    font-size: 1.4em;
  }

  /* トピックス詳細 */
  h3#topics_title {
    font-size: 2em;
    margin: 12px 0 30px!important;
  }
  #topics_body {
    font-size: 1.3em;
  }
  
/*---------------------------------------------------
	トップ　サービス
---------------------------------------------------*/
  #service ul li {
    width: 100%;
    margin: 0 0 15px 0!important;
    float: none;
  }
  #service ul li:last-child {
    margin-bottom: 0;
  }


/*---------------------------------------------------
	トップ　会社概要
---------------------------------------------------*/
  #company table {
    font-size: 1.3em;
  }
  #company table th,
  #company table td {
    padding: 15px 0;
  }
  #company table th {
    width: 80px;
  }


/*---------------------------------------------------
	トップ　お問い合わせ
---------------------------------------------------*/
  #contact table {
    font-size: 1.4em;
    margin-bottom: 15px;
  }
  #contact table td,
  #contact table th {
    display: block;
  }
  #contact table th {
    width: 100%;
    padding: 15px 12px 0;
  }
  #contact table td {
    padding: 0 12px 15px;
  }
  
  #contact a.gmapLink {
    display: block;
    margin-left: 0;
  }

  
/*---------------------------------------------------
	下層ページ　プライバシーポリシー
---------------------------------------------------*/
  #policy h2 span {
    display: block;
    margin: 10px 0 0 0;
  }
  
  #policy p,
  #policy dl,
  #policy ul {
    font-size: 1.3em;
  }

  #policy p,
  #policy dl dd {
    margin-bottom: 25px;
  }
  #policy ul li {
    list-style: disc;
    list-style-position: inside;
  }

  .policyBox {
    margin-bottom: 60px;
  }
  .policyBox:last-of-type {
    margin-bottom: 50px;
  }

}


/*===========================================================================================================
iPhoneSE 
===========================================================================================================*/
@media screen and (max-width: 320px) {
  .sb-slidebar {
    width: 70%!important;
  }
}