@charset "UTF-8";
article, aside, details, figcaption, figure, footer, header, hgroup, hr, menu, nav, section {
  display: block
}

a, hr {
  padding: 0
}

abbr, address, article, aside, audio, b, blockquote, body, canvas, caption, cite, code, dd, del, details, dfn, div, dl, dt, em, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, p, pre, q, samp, section, small, span, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, ul, var, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: 0 0
}

ins, mark {
  background-color: #ff9;
  color: #000
}

body {
	font-family:Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
  line-height: 1
}

nav ul {
  list-style: none
}

blockquote, q {
  quotes: none
}

blockquote:after, blockquote:before, q:after, q:before {
  content: none
}

a {
  margin: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: 0 0
}

ins {
  text-decoration: none
}

mark {
  font-style: italic;
  font-weight: 700
}

del {
  text-decoration: line-through
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help
}

table {
  border-collapse: collapse;
  border-spacing: 0
}

hr {
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0
}

input, select {
  vertical-align: middle
}

@media print, screen and (min-width:769px) {
  a, body {
    color: #181818
  }
  body, input, select, textarea {
    font-family:Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 1.7;
    letter-spacing: .00425em
  }
  .display, .secondPage {
    position: relative;
    left: 0
  }
  #HEADER, #HEADER .context {
    -webkit-transition: all .4s ease-in-out
  }
  * {
    margin: 0;
    padding: 0;
    zoom: 1
  }
  html {
    -webkit-text-size-adjust: none
  }
  h1, h2, h3, h4, h5, h6 {
    font-weight: 500
  }
  img {
    -ms-interpolation-mode: bicubic;
    vertical-align: bottom
  }
  a {
    text-decoration: none;
    outline: 0;
    cursor: pointer
  }
  a:hover {
    color: #666
  }
  a:hover img {
    opacity: .8
  }
  .clear {
    clear: both
  }
  .clearfix:after {
    content: "";
    display: block;
    clear: both
  }
  .display {
    width: 1120px;
    margin: 0 auto;
    top: 0;
    overflow: inherit
  }
  input, textarea {
    -webkit-appearance: none
  }
  i, strong {
    font-style: normal
  }
  .secondPage {
    top: 73px!important
  }
  #HEADER {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 5;
    padding: 0 0 24px;
	  background-color: #001d3f;
    transition: all .4s ease-in-out
  }
  #HEADER .display {
    width: auto;
    min-width: 1120px
  }
  #HEADER .context {
    transition: all .4s ease-in-out;
    float: left;
    margin: 24px 0 0 32px
  }
  #HEADER .context h1 {
    margin: 8px 0 0
  }
  #HEADER .context h1 img {
    height: 60px
  }
  #HEADER .GLOBAL {
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
    margin: 24px 32px 0 0;
    float: right
  }
  #HEADER .GLOBAL ul {
    display: block
  }
  #HEADER .GLOBAL ul li {
    list-style: none;
    float: left;
    margin: 10px 0 0 15px;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    line-height: 1;
	  background-color: #fff;
	  width: 150px;
	  padding: 10px;
	  
	
  }
  #HEADER .GLOBAL ul li:first-child {
    margin-left: 0
  }
  #HEADER .GLOBAL ul li a {
    display: block;
    color: #001e42;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    font-size: 15px;
	  text-align: center;
	  
	
  }
  #HEADER .GLOBAL ul li a:hover {
    text-decoration: none;
  }
  #HEADER .GLOBAL ul .contact {
    margin-top: 0
  }
  #HEADER .GLOBAL ul .contact a {
    padding: 16px 56px;
   border: 1px solid #8f7553;
    background: #8f7553
  }
  #HEADER .GLOBAL ul .contact a:hover {
    background: rgba(255, 255, 255, .2);
    text-decoration: none;
  }
  
ul.company_list,
ul.business_list {
    margin:0;
    padding: 0;
    list-style-type: none;
}

ul.company_list li,
ul.business_list  li {
    list-style-type: none;
    margin-bottom: 1px;
}

ul.company_list li dl {
    margin: 0;
    padding: 0;
}

ul.company_list li dl dt {
    float: left;
    width: 180px;
    background:#E3E3E3;
    padding: 8px 12px;
}

ul.company_list li dl dd {
    background: #fff;
    padding: 8px 12px;
    margin-left: 204px;
}

}

@media screen and (min-width:769px) and (max-width:1200px) {
	#HEADER .GLOBAL {
    margin-left: 20px;
    float: left;
  }
  #HEADER  h1 img {
    height: 70px;
  }
  #HEADER .GLOBAL ul li {
    margin-left: 10px;
		 background-color: #fff;
	  width: 120px;
	  padding: 10px;
  }
  #HEADER .GLOBAL ul .contact a {
    padding: 16px 40px!important
  }
}

@media print, screen and (min-width:769px) {
  #FOOTER, #WRAPPER {
    position: relative;
    z-index: 2
  }
 
  #HEADER.active {
    padding-bottom: 0px
  }
  #HEADER.active .GLOBAL, #HEADER.active .context {
    margin-top: 7px
  }
  #HEADER.active .GLOBAL li a {
    color: #001e42
  }

  #HEADER.active .GLOBAL .contact a {
    border: 1px solid #8f7553;
    background: #8f7553;
    color: #FFF
  }
  #HEADER.active .GLOBAL .contact a:hover {
    border: 1px solid #8f7553;
    background: #8f7553;
	  text-decoration: none !important;

  }
  #FOOTER {
    background: #000;
    top: 0;
    left: 0
  }
  #FOOTER .box {
    padding: 35px 0
  }
  #FOOTER .box dl {
    float: left;
    width: 25%
  }
  #LOADING, #firstView {
    width: 100%;
    height: 100%
  }
  #FOOTER .box dl dt {
    font-size: 16px;
    color: #FFF;
    font-weight: 700;
    margin: 0 0 16px
  }
  #FOOTER .box dl dd {
    margin: 0 0 4px;
    font-size: 10px;
    display: block!important
  }
  #FOOTER .box dl dd a {
    color: #FFF;
    background: url("../images/common/footer_arrow.png") left center no-repeat;
    -ms-background-size: 11px;
    background-size: 11px;
    padding: 0 0 0 20px
  }
  #FOOTER .box dl dd a:hover {
    background-position: 1px center
  }
  #FOOTER .copy {
    background: #0A234D;
    padding: 15px 0;
    color: #FFF;
    font-size: 12px;
    overflow: hidden
  }
  #FOOTER .copy small {
    float: left;
    font-style: normal;
    margin: 12px 0 0
  }
  #FOOTER .copy p {
    float: right
  }
  #page_up {
    position: fixed;
    z-index: 100;
    right: 24px;
    bottom: 24px;
    display: none
  }
  #LOADING {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    background: #001e42;
  }
  #LOADING img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 32px;
    height: 32px;
    margin: -16px 0 0 -16px;
    animation: animetion .4s linear infinite;
    -moz-animation: animetion .4s linear infinite;
    -ms-animation: animetion .4s linear infinite;
    -o-animation: animetion .4s linear infinite;
    -webkit-animation: animetion .4s linear infinite
  }
  @keyframes animetion {
    0% {
      -webkit-transform: rotate(0);
      transform: rotate(0)
    }
    100% {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg)
    }
  }
  @-webkit-keyframes animetion {
    0% {
      transform: rotate(0);
      -webkit-transform: rotate(0)
    }
    100% {
      transform: rotate(360deg);
      -webkit-transform: rotate(360deg)
    }
  }
  #WRAPPER {
    top: 0;
    left: 0;
    background: #f2f2f2
  }
  #WRAPPER .wrap {
    padding: 64px 0;
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: scroll;
    -ms-background-size: cover;
    background-size: cover
  }
  #WRAPPER .wrap .hgroup {
    text-align: center;
    margin: 0 0 48px
  }
  #WRAPPER .wrap .hgroup h2 {
    line-height: 1.4;
    font-size: 28px
  }
  #WRAPPER .wrap .hgroup p {
    font-size: 14px;
    margin: 4px 0 0
  }
  #firstView {
    position: fixed;
    background: #000;
    top: 0;
    left: 0;
    z-index: 1;
    overflow: hidden;
	  margin-top: 90px;
  }
  #firstView .set {
    display: none!important
  }
  #firstView .setMovie img {
    position: fixed;
    top: 0;
    right: 0;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -1
  }
  #firstView .title {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 80%;
    display: table;
	  
   
  }
  #firstView .title .cell {
    display: table-cell;
    vertical-align: middle;
    text-align: center
  }
  #firstView .title .scroll {
    position: absolute;
    left: 50%;
    margin: 0 0 0 -30px;
    bottom: 8px;
    width: 60px;
    opacity: 0;
    -webkit-transition: all .8s ease-in-out;
    transition: all .8s ease-in-out
  }
  #firstView .title .scroll i {
    color: #FFF;
    font-size: 9px;
    display: block;
    margin: 16px 0 0;
    letter-spacing: .02em;
    opacity: .8
  }
  #firstView .title .scroll a {
    display: block
  }
  #firstView .title .mouse {
    text-align: center;
    width: 24px;
    height: 40px;
    margin: 0 auto;
    border: 1.5px solid #FFF;
    border-radius: 20px;
    overflow: hidden
  }
  #firstView .title .text {
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    opacity: 0;
    margin: -12px 0 0;
    -webkit-transition: all 2s ease-in-out;
    transition: all 2s ease-in-out
  }
  #firstView .title .text img {
    width: 56%;
    min-width: 800px;
    max-width: 1500px
  }
  .INDEX .blog, .INDEX .first, .INDEX .two {
    min-width: 1120px;
    max-width: 1920px
  }
  #firstView .title .text .btnArea {
    margin: 48px 0 0;
    -webkit-transform: translateX(0) translateY(-16px);
    transform: translateX(0) translateY(-16px);
    -webkit-transition: all .8s ease-in-out;
    transition: all .8s ease-in-out;
    opacity: 0
  }
  #firstView .title .text .btnArea a.btn {
    border: 1px solid #FFF;
    padding: 10px 0;
    width: 210px;
    display: inline-block;
    color: #FFF;
    font-size: 15px;
    letter-spacing: .024em;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    margin: 0 8px;
    background: 0 0
  }
  #firstView .title .text .btnArea a.btn:hover {
    background: rgba(255, 255, 255, .3)
  }
  #firstView .title .sns {
    position: absolute;
    bottom: 24px;
    right: 24px
  }
  #firstView .title .sns li {
    float: left;
    list-style: none;
    margin: 0 0 0 16px
  }
  #firstView .title .sns li img {
    width: 24px
  }
  #firstView .title .active {
    opacity: 1
  }
  #firstView .title .btnArea.active {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1
  }
  #firstView .title .scroll.active {
    bottom: 24px;
    opacity: 1
  }
  #firstView .message {
    color: #FFF;
    font-size: 18px;
    margin: 28px 0 0;
    opacity: 0;
    -webkit-transform: scale(.9);
    transform: scale(.9);
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
    line-height: 1.4
  }
  #firstView .message strong {
    font-size: 32px;
    display: inline-block;
    margin: 0 4px;
    font-weight: 700
  }
  #firstView .message.active {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
  .INDEX .hGroup {
    text-align: center;
    line-height: 1;
    margin: 0 0 36px
  }
  .INDEX .hGroup h2 {
    font-size: 32px;
    font-weight: 700;
    letter-spacing: .1em
  }
  .INDEX .hGroup p {
    font-size: 15px;
    margin: 12px 0 0
  }
  .INDEX .wrap {
    padding: 64px 0
  }



}

@media screen and (min-width:769px) and (max-width:1300px) {
  
}

@media screen and (min-width:769px) and (min-width:1281px) {
  
}

@media print, screen and (min-width:769px) {



  .INDEX .frontThree {
    padding: 64px 0;
    background: #FFF;
    border-bottom: #ddd 1px solid
  }
  .INDEX .frontThree .bnrs li {
    list-style: none;
    width: 49%;
    float: left
  }
  .INDEX .frontThree .bnrs li:nth-child(2n+2) {
    float: right
  }
  .INDEX .frontThree .bnrs li img {
    width: 100%
  }


  
  
  .wrapper {
    background: #FFF
  }
  .wrapper .bnr_area, .wrapper h3 {
    border-radius: 6px;
    background: #e5e5e5
  }
  .wrapper .left_block {
    width: 65%;
    float: left
  }
  .wrapper .right_block {
    width: 30%;
    float: right
  }
  .wrapper h3 {
    font-size: 20px;
    padding: 5px 20px;
    margin: 0 0 24px
  }
  .wrapper .sbox {
    margin: 0 0 60px
  }
  .wrapper .sbox:last-child {
    margin: 0
  }
  .wrapper .bnr_area {
    padding: 20px;
    margin: 0 0 20px
  }
  .wrapper .bnr_area li {
    list-style: none;
    margin: 0 0 20px
  }
  .wrapper .bnr_area li:last-child {
    margin: 0
  }
  .wrapper .bnr_area li img {
    width: 100%;
    vertical-align: bottom
  }
  .wrapper .bnr_area li a {
    display: block;
    background: #FFF
  }
  .wrapper .bnr_area li a img {
    -webkit-transition: all 160ms ease-in-out;
    transition: all 160ms ease-in-out
  }
  .wrapper .bnr_area li a:hover img {
    opacity: .5
  }

  
}






@media print, screen and (min-width:641px) and (max-width:768px) {
  a, body {
    color: #181818
  }
  body, input, select, textarea {
    font-family: Lato, "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
    font-weight: 500;
    line-height: 1.7;
    letter-spacing: .00425em;
    font-size: 14px
  }
  #HEADER, #HEADER .context {
    -webkit-transition: all .4s ease-in-out
  }
  #FOOTER .box dl dt, #HEADER .GLOBAL, #page .btn, #page .btn_o, #page .forms .wpcf7-submit, #page .portfolio_sp li figure, a {
    cursor: pointer
  }
  .display, .secondPage {
    position: relative;
    left: 0
  }
  #page .float, * {
    zoom: 1
  }
  #page .float:after, .INDEX .staffBlog .photos, .INDEX .staffBlog .photos li:nth-child(3n+1), .STAFF ul li:nth-child(3n+1), .STAFF ul:after, .clear, .clearfix:after, .right_block .gadget .blogList li:nth-child(2n+1) {
    clear: both
  }
  * {
    margin: 0;
    padding: 0
  }
  html {
    -webkit-text-size-adjust: none
  }
  h1, h2, h3, h4, h5, h6 {
    font-weight: 500
  }
  img {
    -ms-interpolation-mode: bicubic;
    vertical-align: bottom;
    max-width: 100%;
    height: auto
  }
  a {
    text-decoration: none;
    outline: 0
  }
  a:hover {
    color: #666
  }
  a:hover img {
    opacity: .8
  }
  .clearfix:after {
    content: "";
    display: block
  }
  .display {
    width: auto;
    margin: 0 auto;
    top: 0;
    overflow: inherit
  }
  input, textarea {
    -webkit-appearance: none
  }
  i, strong {
    font-style: normal
  }
  .secondPage {
    top: 56px!important
  }
  #HEADER {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 5;
    transition: all .4s ease-in-out;
    background: #001e42;
    height: 56px;
	
  }
  #HEADER .display {
    width: auto;
    min-width: auto;
    overflow: visible
  }
  #HEADER .context {
    transition: all .4s ease-in-out;
    float: left;
    margin: 12px 0 0 16px
  }
  #HEADER .context h1 {
    margin: 4px 0 0
  }
  #HEADER .context h1 img {
    height: 24px
  }
  #HEADER .GLOBAL {
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
    margin: 12px 16px 0 0;
    float: right;
    background: url("../images/common/heder_nav.png") center 0 no-repeat;
    -ms-background-size: 32px 64px;
    background-size: 32px 64px;
    width: 32px;
    height: 32px
  }
  #HEADER .GLOBAL ul {
    position: absolute;
    top: 56px;
    left: 0;
    z-index: 3;
    width: 100%;
    background: #bac48f;
    display: none;
    -webkit-box-shadow: 0 4px 4px rgba(0, 0, 0, .1);
    -o-box-shadow: 0 4px 4px rgba(0, 0, 0, .1);
    -ms-box-shadow: 0 4px 4px rgba(0, 0, 0, .1);
    box-shadow: 0 4px 4px rgba(0, 0, 0, .1)
  }
  #FOOTER, #WRAPPER {
    position: relative;
    top: auto;
    z-index: 2
  }
  #HEADER .GLOBAL ul li {
    list-style: none;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    line-height: 1
  }
  #HEADER .GLOBAL ul li a {
    display: block;
    color: #1b1b1b;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    font-size: 14px;
    border-top: #ddd 1px solid;
    padding: 16px 12px;
    background: url("../images/fix/icon_arrow_l.png") 96% center no-repeat;
    -ms-background-size: 8px 13px;
    background-size: 8px 13px
  }
  #HEADER .GLOBAL ul li a:hover {
    background: url("../images/fix/icon_arrow_l.png") 97% center no-repeat #f2f2f2;
    -ms-background-size: 8px 13px;
    background-size: 8px 13px
  }
  #HEADER .addClose {
    background: url("../images/common/heder_nav.png") center -32px no-repeat;
    -ms-background-size: 32px 64px;
    background-size: 32px 64px
  }
  #FOOTER {
    background: #232323;
    left: 0
  }
  #FOOTER .box {
    padding: 24px 16px
  }
  #FOOTER .box dl {
    margin: 0 0 12px;
    border: 1px solid rgba(255, 255, 255, .08);
    border-bottom: none;
    background: rgba(0, 0, 0, .2);
    border-radius: 6px;
    overflow: hidden
  }
  #FOOTER .box dl dd, #FOOTER .box dl dt {
    border-bottom: rgba(255, 255, 255, .08) 1px solid
  }
  #FOOTER .box dl:last-child {
    margin: 0
  }
  #FOOTER .box dl dt {
    font-size: 15px;
    color: #FFF;
    font-weight: 700;
    padding: 12px;
    background: url("../images/common/footer_icon_plus.png") 98% center no-repeat;
    -ms-background-size: 16px;
    background-size: 16px
  }
  #FOOTER .box dl .addClose {
    background: url("../images/common/footer_icon_mainus.png") 98% center no-repeat;
    -ms-background-size: 16px;
    background-size: 16px
  }
  #FOOTER .box dl dd {
    font-size: 12px;
    display: none
  }
  #FOOTER .box dl dd a {
    color: #FFF;
    display: block;
    background: url("../images/common/footer_arrow.png") 12px center no-repeat;
    -ms-background-size: 11px;
    background-size: 11px;
    padding: 12px 12px 12px 32px
  }
  #FOOTER .box dl dd a:hover {
    background: url("../images/common/footer_arrow.png") 13px center no-repeat;
    -ms-background-size: 11px;
    background-size: 11px
  }
  #FOOTER .copy {
    background: #0A234D;
    padding: 16px 12px;
    color: #FFF;
    font-size: 12px;
    overflow: hidden
  }
  #FOOTER .copy small {
    float: left;
    font-style: normal;
    margin: 12px 0 0
  }
  #FOOTER .copy p {
    float: right
  }
  #LOADING {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    width: 100%;
    height: 100%;
    background: #FFF
  }
  #LOADING img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 32px;
    height: 32px;
    margin: -16px 0 0 -16px;
    animation: animetion .4s linear infinite;
    -moz-animation: animetion .4s linear infinite;
    -ms-animation: animetion .4s linear infinite;
    -o-animation: animetion .4s linear infinite;
    -webkit-animation: animetion .4s linear infinite
  }
  @keyframes animetion {
    0% {
      -webkit-transform: rotate(0);
      transform: rotate(0)
    }
    100% {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg)
    }
  }
  @-webkit-keyframes animetion {
    0% {
      transform: rotate(0);
      -webkit-transform: rotate(0)
    }
    100% {
      transform: rotate(360deg);
      -webkit-transform: rotate(360deg)
    }
  }
  #page_up {
    position: fixed;
    z-index: 100;
    right: 16px;
    bottom: 16px;
    display: none
  }
  #WRAPPER {
    left: 0;
    background: #f2f2f2
  }
  #firstView, #firstView .setMovie {
    position: fixed;
    left: 0;
    width: 100%
  }
  #WRAPPER .wrap {
    padding: 48px 0;
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: scroll;
    -ms-background-size: cover;
    background-size: cover
  }
  #WRAPPER .wrap .hgroup {
    text-align: center;
    margin: 0 0 48px
  }
  #WRAPPER .wrap .hgroup h2 {
    line-height: 1.4;
    font-size: 28px
  }
  #WRAPPER .wrap .hgroup p {
    font-size: 14px;
    margin: 4px 0 0
  }
  #firstView {
    background: #000;
    top: 0;
    z-index: 1;
    overflow: hidden;
    height: auto
  }
  #firstView .set {
    display: none!important
  }
  #firstView .setMovie {
    top: 0;
    height: 100%;
    z-index: -1;
    background: url("../images/common/head_s.jpg") center center no-repeat;
    -ms-background-size: cover;
    background-size: cover
  }
  #firstView .setMovie img {
    display: none
  }
  #firstView .title {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: table;
    background: url("../images/slider/dotto_sp.png") center center
  }
  #firstView .title .cell {
    display: table-cell;
    vertical-align: middle;
    text-align: center
  }
  #firstView .title .scroll {
    position: absolute;
    left: 50%;
    margin: 0 0 0 -30px;
    bottom: 8px;
    width: 60px;
    opacity: 0;
    -webkit-transition: all .8s ease-in-out;
    transition: all .8s ease-in-out
  }
  #firstView .title .scroll i {
    color: #FFF;
    font-size: 11px;
    display: block;
    margin: 16px 0 0;
    letter-spacing: .02em;
    opacity: .8
  }
  #firstView .title .scroll a {
    display: block
  }
  #firstView .title .mouse {
    text-align: center;
    width: 24px;
    height: 40px;
    margin: 0 auto;
    border: 1.5px solid #FFF;
    border-radius: 20px;
    -webkit-transform: scale(.8);
    transform: scale(.8);
    overflow: hidden
  }
  #firstView .title .text {
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    opacity: 0;
    margin: 20px 0 0;
    -webkit-transition: all 2s ease-in-out;
    transition: all 2s ease-in-out
  }
  #firstView .title .text img {
    width: 88%
  }
  #firstView .title .text .btnArea {
    margin: 32px 0 0;
    opacity: 0;
    -webkit-transform: translateX(0) translateY(-16px);
    transform: translateX(0) translateY(-16px);
    -webkit-transition: all .8s ease-in-out;
    transition: all .8s ease-in-out
  }
  #firstView .title .text .btnArea a.btn {
    border: 1px solid #FFF;
    padding: 10px 0;
    width: 210px;
    display: inline-block;
    color: #FFF;
    font-size: 14px;
    letter-spacing: .024em;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    background: 0 0;
    margin: 0 8px
  }
  #firstView .title .text .btnArea a.btn:hover {
    background: rgba(255, 255, 255, .3)
  }
  #firstView .title .sns {
    position: absolute;
    bottom: 24px;
    right: 24px
  }
  #firstView .title .sns li {
    float: left;
    list-style: none;
    margin: 0 0 0 16px
  }
  #firstView .title .sns li img {
    width: 24px
  }
  #firstView .title .active {
    opacity: 1
  }
  #firstView .title .btnArea.active {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1
  }
  #firstView .title .scroll.active {
    bottom: 20px;
    opacity: 1
  }
  #firstView .message {
    color: #FFF;
    font-size: 16px;
    margin: 28px 0 0;
    opacity: 0;
    -webkit-transform: scale(.9);
    transform: scale(.9);
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
    line-height: 1.4
  }
  #firstView .message strong {
    font-size: 24px;
    display: inline-block;
    margin: 0 4px;
    font-weight: 700
  }
  #firstView .message.active {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
  .INDEX .hGroup {
    text-align: center;
    line-height: 1;
    margin: 0 0 36px
  }
  .INDEX .hGroup h2 {
    font-size: 24px;
    font-weight: 700;
    letter-spacing: .1em
  }
  .INDEX .hGroup p {
    font-size: 14px;
    margin: 12px 0 0
  }
  .INDEX .wrap {
    padding: 48px 0
  }
  .INDEX .first {
    min-width: auto;
    max-width: auto;
    margin: 0 auto
  }
  .INDEX .first:before {
    content: 'Solution';
    text-align: center;
    background: #FFF;
    padding: 8px 32px;
    display: block;
    font-size: 18px;
    font-weight: 700
  }
  .INDEX .first ul li {
    width: 100%;
    float: left;
    list-style: none;
    background: #000;
    color: #f2f2f2
  }
  .INDEX .first ul li:nth-child(1) {
    background: url("../images/top/first_photo01.jpg") no-repeat;
    -ms-background-size: cover;
    background-size: cover
  }
  .INDEX .first ul li:nth-child(2) {
    background: url("../images/top/first_photo03.jpg") no-repeat;
    -ms-background-size: cover;
    background-size: cover
  }
  .INDEX .first ul li:nth-child(3) {
    background: url("../images/top/first_photo02.jpg") no-repeat;
    -ms-background-size: cover;
    background-size: cover
  }
  .INDEX .first ul li:nth-child(4) {
    background: url("../images/top/first_photo04.jpg") no-repeat;
    -ms-background-size: cover;
    background-size: cover
  }
  .INDEX .first ul li .context {
    width: 60%;
    height: 300px;
    display: table;
    float: right
  }
  .INDEX .first ul li .context .cell {
    display: table-cell;
    vertical-align: middle;
    text-align: left;
    padding: 0 32px
  }
  .INDEX .first ul li .context i {
    font-size: 10px;
    display: block;
    margin: 0 0 4px
  }
  .INDEX .first ul li .context h2 {
    font-size: 22px;
    line-height: 1;
    margin: 0 0 20px
  }
  .INDEX .first ul li .context p {
    font-size: 13px;
    text-align: justify
  }
  .INDEX .first ul li .context .btnArea {
    margin: 24px 0 0
  }
  .INDEX .first ul li .context .btnArea a {
    padding: 8px 0;
    width: 260px;
    text-align: center;
    border: 1px solid #FFF;
    color: #FFF;
    display: inline-block;
    margin: 0 8px 0 0;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
  }
  .INDEX .first ul li .context .btnArea a:hover {
    background: rgba(255, 255, 255, .3)
  }
  .INDEX .first ul li .context .btnArea a:last-child {
    margin: 0
  }
  
  
  .INDEX .clum {
    background: #FFF;
    min-width: auto;
    max-width: auto;
    margin: 0 auto
  }
  .INDEX .clum ul.three>li {
    list-style: none
  }
  .INDEX .clum ul.three>li .box {
    padding: 0 32px;
    height: 280px;
    overflow: hidden
  }
  .INDEX .clum .info {
    background: #f2f2f2
  }
  .INDEX .clum .info h4 {
    font-size: 16px;
    font-weight: 700;
    margin: 24px 0 12px
  }
  .INDEX .clum .info ul {
    overflow: auto;
    height: 190px;
    padding: 0 16px 0 0
  }
  .INDEX .clum .info ul li {
    list-style: none;
    margin: 0 0 16px;
    padding: 0 0 16px;
    border-bottom: #ddd 1px solid
  }
  .INDEX .clum .info ul li dl dt {
    background: #6288C6;
    color: #FFF;
    font-size: 10px;
    display: inline-block;
    padding: 2px 12px;
    vertical-align: middle;
    float: left;
    text-align: center;
    margin: 0 16px 0 0
  }
  .INDEX .clum .contact {
    background: #0A234D;
    color: #FFF
  }
  .INDEX .clum .contact a {
    color: #FFF
  }
  .INDEX .clum .contact .box {
    padding: 0!important;
    width: 100%;
    display: table;
    height: 300px!important
  }
  .INDEX .clum .contact .box .cell {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.5
  }
  .INDEX .sns ul li, .INDEX .sns ul li iframe {
    vertical-align: bottom
  }
  .INDEX .clum .contact .box .cell a.tel {
    font-size: 28px;
    font-weight: 500
  }
  .INDEX .clum .contact .box .cell figure {
    padding: 24px 0 0
  }
  .INDEX .clum .contact .box .cell figure figcaption {
    font-size: 16px;
    text-decoration: underline;
    margin: 20px 0 0;
    color: #FFF
  }
  .INDEX .clum .contact .box .cell figure a {
    display: inline-block
  }
  .INDEX .clum .contact .box .cell figure a:hover img {
    opacity: 1
  }
  .INDEX .clum .map .box {
    padding: 0!important;
    width: 100%
  }
  .INDEX .clum .map .box iframe {
    display: block;
    width: 100%;
    height: 100%
  }
  .INDEX .clum .map .box .map-embed {
    width: 100%;
    height: 280px;
    margin: 0;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0
  }
  .INDEX .clum .map .box .map-embed>div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0
  }
  .INDEX .clum .map .box .map-embed .map-embed img {
    max-width: none
  }
 
  .INDEX .frontThree {
    padding: 32px 16px;
    background: #FFF;
    border-bottom: #ddd 1px solid
  }
  .INDEX .frontThree .bnrs li {
    list-style: none;
    width: 49%;
    float: left
  }
  .INDEX .frontThree .bnrs li:nth-child(2n+2) {
    float: right
  }
  .INDEX .frontThree .bnrs li img {
    width: 100%
  }
 
  #FOOTER.secondPage {
    top: 56px!important
  }
  
  

 
  
  .wrapper {
    background: #FFF
  }
  .wrapper .bnr_area, .wrapper h3 {
    border-radius: 6px;
    background: #e5e5e5
  }
  .wrapper h3 {
    font-size: 20px;
    padding: 5px 20px;
    font-weight: 700;
    margin: 0 0 24px
  }
  .wrapper .sbox {
    margin: 0 15px 30px
  }
  .wrapper .sbox:lp .flex1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
  }
  .wrapper .sbox:lp .flex1 .flex-item {
    width: 48%;
    margin: 0 1%
  }
  .wrapper .bnr_area {
    padding: 2%;
    margin: 15px
  }
  .wrapper .bnr_area li {
    list-style: none;
    width: 32%;
    margin: 0 0 2%;
    float: left
  }
  .wrapper .bnr_area li:nth-child(2), .wrapper .bnr_area li:nth-child(4) {
    margin: 0 2% 2%
  }
  .wrapper .bnr_area li:first-child, .wrapper .bnr_area li:nth-last-child(-n+2) {
    margin-bottom: 0
  }
  .wrapper .bnr_area li img {
    width: 100%;
    vertical-align: bottom
  }
  .wrapper .bnr_area li a {
    display: block;
    background: #FFF
  }
  .wrapper .bnr_area li a img {
    -webkit-transition: all 160ms ease-in-out;
    transition: all 160ms ease-in-out
  }
  .wrapper .bnr_area li a:hover img {
    opacity: .5
  }
  
  ul.company_list,
ul.business_list {
    margin:0;
    padding: 0;
    list-style-type: none;
}

ul.company_list li,
ul.business_list  li {
    list-style-type: none;
    margin-bottom: 1px;
}

ul.company_list li dl {
    margin: 0;
    padding: 0;
}

ul.company_list li dl dt {
    float: left;
    width: 180px;
    background:#E3E3E3;
    padding: 8px 12px;
}

ul.company_list li dl dd {
    background: #fff;
    padding: 8px 12px;
    margin-left: 204px;
}
  
}

@media print, screen and (min-width:0px) and (max-width:640px) {
  a, body {
    color: #181818
  }
  body, input, select, textarea {
    font-family: Lato, "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
    font-weight: 500;
    font-size: 13.5px;
    line-height: 1.7;
    letter-spacing: .00425em
  }
  .display, .secondPage {
    position: relative;
    left: 0
  }
  #HEADER, #HEADER .context {
    -webkit-transition: all .4s ease-in-out
  }
  * {
    margin: 0;
    padding: 0;
    zoom: 1
  }
  html {
    -webkit-text-size-adjust: none
  }
  h1, h2, h3, h4, h5, h6 {
    font-weight: 500
  }
  img {
    -ms-interpolation-mode: bicubic;
    vertical-align: bottom;
    max-width: 100%;
    height: auto
  }
  .INDEX .blog, .INDEX .clum, .INDEX .first, .INDEX .two {
    max-width: auto;
    min-width: auto
  }
  a {
    text-decoration: none;
    outline: 0;
    cursor: pointer
  }
  a:hover {
    color: #666
  }
  a:hover img {
    opacity: .8
  }
  .clear {
    clear: both
  }
  .clearfix:after {
    content: "";
    display: block;
    clear: both
  }
  .display {
    width: auto;
    margin: 0 auto;
    top: 0;
    overflow: inherit
  }
  input, textarea {
    -webkit-appearance: none
  }
  i, strong {
    font-style: normal
  }
  .secondPage {
    top: 56px!important
  }
  #HEADER {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 5;
    transition: all .4s ease-in-out;
    background: #001e42;
	  border-bottom: 2px solid #bac48f;
    height: 56px;
  }
  #HEADER .display {
    width: auto;
    min-width: auto;
    overflow: visible
  }
  #HEADER .context {
    transition: all .4s ease-in-out;
    float: left;
    margin: 12px 0 0 12px
  }
  #HEADER .context h1 {
    margin: 4px 0 0
  }
  #HEADER .context h1 img {
    height: 24px
  }
  #HEADER .GLOBAL {
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
    margin: 12px 12px 0 0;
    float: right;
    background: url("../images/common/heder_nav.png") center 0 no-repeat;
    -ms-background-size: 32px 64px;
    background-size: 32px 64px;
    width: 32px;
    height: 32px;
    cursor: pointer
  }
  #HEADER .GLOBAL ul {
    position: absolute;
    top: 56px;
    left: 0;
    z-index: 3;
    width: 100%;
    background: #bac48f;
    display: none;
    -webkit-box-shadow: 0 4px 4px rgba(0, 0, 0, .1);
    -o-box-shadow: 0 4px 4px rgba(0, 0, 0, .1);
    -ms-box-shadow: 0 4px 4px rgba(0, 0, 0, .1);
    box-shadow: 0 4px 4px rgba(0, 0, 0, .1)
  }
  #FOOTER, #WRAPPER {
    position: relative;
    top: auto;
    z-index: 2
  }
  #LOADING img, #page_up img {
    width: 32px;
    height: 32px
  }
  #HEADER .GLOBAL ul li {
    list-style: none;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    line-height: 1
  }
  #HEADER .GLOBAL ul li a {
    display: block;
    color: #181818;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    font-size: 14px;
    border-top: #ddd 1px solid;
    padding: 16px 12px;
    background: url("../images/fix/icon_arrow_l.png") 93% center no-repeat;
    -ms-background-size: 8px 13px;
    background-size: 8px 13px
  }
  #HEADER .GLOBAL ul li a:hover {
    background: url("../images/fix/icon_arrow_l.png") 94% center no-repeat #f2f2f2;
    -ms-background-size: 8px 13px;
    background-size: 8px 13px
  }
  #HEADER .addClose {
    background: url("../images/common/heder_nav.png") center -32px no-repeat;
    -ms-background-size: 32px 64px;
    background-size: 32px 64px
  }
  #FOOTER {
    background: #232323;
    left: 0
  }
  #FOOTER .box {
    padding: 24px 12px
  }
  #FOOTER .box dl {
    margin: 0 0 12px;
    border: 1px solid rgba(255, 255, 255, .08);
    border-bottom: none;
    background: rgba(0, 0, 0, .2);
    border-radius: 6px;
    overflow: hidden
  }
  #FOOTER .box dl dd, #FOOTER .box dl dt {
    border-bottom: rgba(255, 255, 255, .08) 1px solid
  }
  #FOOTER .box dl:last-child {
    margin: 0
  }
  #FOOTER .box dl dt {
    font-size: 15px;
    color: #FFF;
    font-weight: 700;
    padding: 12px;
    background: url("../images/common/footer_icon_plus.png") 96% center no-repeat;
    -ms-background-size: 16px;
    background-size: 16px;
    cursor: pointer
  }
  #FOOTER .box dl .addClose {
    background: url("../images/common/footer_icon_mainus.png") 96% center no-repeat;
    -ms-background-size: 16px;
    background-size: 16px
  }
  #FOOTER .box dl dd {
    font-size: 12px;
    display: none
  }
  #FOOTER .box dl dd a {
    color: #FFF;
    background: url("../images/common/footer_arrow.png") 12px center no-repeat;
    -ms-background-size: 11px;
    background-size: 11px;
    padding: 12px 12px 12px 32px;
    display: block
  }
  #FOOTER .box dl dd a:hover {
    background: url("../images/common/footer_arrow.png") 13px center no-repeat;
    -ms-background-size: 11px;
    background-size: 11px
  }
  #FOOTER .copy {
    background: #0A234D;
    padding: 16px 12px;
    color: #FFF;
    font-size: 12px;
    overflow: hidden;
    text-align: center
  }
  #FOOTER .copy small {
    font-style: normal;
    margin: 0 0 12px;
    display: block
  }
  #LOADING {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    width: 100%;
    height: 100%;
    background: #FFF
  }
  #LOADING img {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -16px 0 0 -16px;
    animation: animetion .4s linear infinite;
    -moz-animation: animetion .4s linear infinite;
    -ms-animation: animetion .4s linear infinite;
    -o-animation: animetion .4s linear infinite;
    -webkit-animation: animetion .4s linear infinite
  }
  @keyframes animetion {
    0% {
      -webkit-transform: rotate(0);
      transform: rotate(0)
    }
    100% {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg)
    }
  }
  @-webkit-keyframes animetion {
    0% {
      transform: rotate(0);
      -webkit-transform: rotate(0)
    }
    100% {
      transform: rotate(360deg);
      -webkit-transform: rotate(360deg)
    }
  }
  #page_up {
    position: fixed;
    z-index: 100;
    right: 12px;
    bottom: 12px;
    display: none
  }
  #WRAPPER {
    left: 0;
    background: #f2f2f2
  }
  #firstView, #firstView .setMovie {
    position: fixed;
    left: 0;
    width: 100%
  }
  #WRAPPER .wrap {
    padding: 32px 0;
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: scroll;
    -ms-background-size: cover;
    background-size: cover
  }
  #WRAPPER .wrap .hgroup {
    text-align: center;
    margin: 0 0 24px
  }
  #WRAPPER .wrap .hgroup h2 {
    line-height: 1.4;
    font-size: 18px
  }
  #WRAPPER .wrap .hgroup p {
    font-size: 12px;
    margin: 4px 0 0
  }
  #firstView {
    background: #000;
    top: 0;
    z-index: 1;
    overflow: hidden;
    height: auto
  }
  #firstView .set {
    display: none!important
  }
  #firstView .setMovie {
    top: 0;
    height: 100%;
    z-index: -1;
    background: url("../images/common/head_s.jpg") center center no-repeat;
    -ms-background-size: cover;
    background-size: cover
  }
  #firstView .setMovie img {
    display: none
  }
  #firstView .title {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: table;
    background: url("../images/slider/dotto_sp.png") center center
  }
  #firstView .title .cell {
    display: table-cell;
    vertical-align: middle;
    text-align: center
  }
  #firstView .title .scroll {
    position: absolute;
    left: 50%;
    margin: 0 0 0 -30px;
    bottom: -10px;
    width: 60px;
    opacity: 0;
    -webkit-transform: scale(.8);
    transform: scale(.8);
    -webkit-transition: all .8s ease-in-out;
    transition: all .8s ease-in-out
  }
  #firstView .title .scroll i {
    color: #FFF;
    font-size: 11px;
    display: block;
    margin: 16px 0 0;
    letter-spacing: .02em;
    opacity: .8
  }
  #firstView .title .scroll a {
    display: block
  }
  #firstView .title .mouse {
    text-align: center;
    width: 24px;
    height: 40px;
    margin: 0 auto;
    border: 1.5px solid #FFF;
    border-radius: 20px;
    overflow: hidden
  }
  #firstView .title .text {
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    opacity: 0;
    margin: 40px 0 0;
    -webkit-transition: all 2s ease-in-out;
    transition: all 2s ease-in-out
  }
  #firstView .title .text img {
    width: 88%
  }
  #firstView .title .text .btnArea {
    margin: 32px 0 0;
    opacity: 0;
    -webkit-transform: translateX(0) translateY(-8px);
    transform: translateX(0) translateY(-8px);
    -webkit-transition: all .8s ease-in-out;
    transition: all .8s ease-in-out
  }
  #firstView .title .text .btnArea a.btn {
    border: 1px solid rgba(255, 255, 255, .88);
    padding: 10px 0;
    width: 64%;
    display: block;
    color: #FFF;
    font-size: 13px;
    letter-spacing: .024em;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    background: 0 0;
    margin: 0 auto 16px
  }
  #firstView .title .text .btnArea a.btn:last-child {
    margin-bottom: 0
  }
  #firstView .title .text .btnArea a.btn:hover {
    background: rgba(255, 255, 255, .3)
  }
  #firstView .title .sns {
    position: absolute;
    bottom: 14px;
    right: 12px
  }
  #firstView .title .sns li {
    float: left;
    list-style: none;
    margin: 0 0 0 16px
  }
  #firstView .title .sns li img {
    width: 16px
  }
  #firstView .title .active {
    opacity: 1
  }
  #firstView .title .btnArea.active {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1
  }
  #firstView .title .scroll.active {
    bottom: 8px;
    opacity: 1
  }
  #firstView .message {
    color: #FFF;
    font-size: 14px;
    margin: 24px 0 0;
    opacity: 0;
    -webkit-transform: scale(.9);
    transform: scale(.9);
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
    line-height: 1.4
  }
  #firstView .message strong {
    font-size: 20px;
    display: inline-block;
    margin: 0 4px;
    font-weight: 700
  }
  #firstView .message.active {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
  .INDEX .hGroup {
    text-align: center;
    line-height: 1;
    margin: 0 0 24px
  }
  .INDEX .hGroup h2 {
    font-size: 28px;
    font-weight: 700;
    letter-spacing: .1em
  }
  .INDEX .hGroup p {
    font-size: 14px;
    margin: 12px 0 0
  }
  .INDEX .wrap {
    padding: 32px 0
  }
  
  
  
  .INDEX .clum {
    background: #FFF;
    margin: 0 auto
  }
  .INDEX .clum ul.three>li {
    list-style: none
  }
  .INDEX .clum ul.three>li .box {
    padding: 0 12px;
    height: 280px;
    overflow: hidden
  }
  .INDEX .clum .info {
    background: #f2f2f2
  }
  .INDEX .clum .info h4 {
    font-size: 16px;
    font-weight: 700;
    margin: 24px 0 12px
  }
  .INDEX .clum .info ul {
    overflow: auto;
    height: 190px;
    padding: 0 16px 0 0
  }
  .INDEX .clum .info ul li {
    list-style: none;
    margin: 0 0 16px;
    padding: 0 0 16px;
    border-bottom: #ddd 1px solid
  }
  .INDEX .clum .info ul li dl dt {
    background: #6288C6;
    color: #FFF;
    font-size: 10px;
    display: inline-block;
    padding: 2px 12px;
    vertical-align: middle;
    float: left;
    text-align: center;
    margin: 0 16px 0 0
  }
  .INDEX .clum .contact {
    background: #0A234D;
    color: #FFF
  }
  .INDEX .clum .contact a {
    color: #FFF
  }
  .INDEX .clum .contact .box {
    padding: 0!important;
    width: 100%;
    display: table
  }
  .INDEX .clum .contact .box .cell {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.5;
    padding: 0 12px
  }
  .INDEX .clum .contact .box .cell a.tel {
    font-size: 24px;
    font-weight: 500
  }
  .INDEX .clum .contact .box .cell figure {
    padding: 24px 0 0
  }
  .INDEX .clum .contact .box .cell figure figcaption {
    font-size: 15px;
    text-decoration: underline;
    margin: 20px 0 0;
    color: #FFF
  }
  .INDEX .clum .contact .box .cell figure a {
    display: block
  }
  .INDEX .clum .contact .box .cell figure a:hover img {
    opacity: 1
  }
  .INDEX .clum .map {
    height: 140px
  }
  .INDEX .clum .map .box {
    padding: 0!important;
    width: 100%
  }
  .INDEX .clum .map .box iframe {
    display: block;
    width: 100%;
    height: 140px
  }
  .INDEX .clum .map .box .map-embed {
    width: 100%;
    height: 140px;
    margin: 0;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0
  }
  .INDEX .clum .map .box .map-embed>div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0
  }
  .INDEX .clum .map .box .map-embed .map-embed img {
    max-width: none
  }
  
  
  .INDEX .frontThree {
    padding: 0 16px 32px;
    background: #FFF;
    border-bottom: #ddd 1px solid
  }
  .INDEX .frontThree .bnrs li {
    list-style: none;
    margin: 0 0 16px
  }
  .INDEX .frontThree .bnrs li:last-child {
    margin: 0
  }
  .INDEX .frontThree .bnrs li img {
    width: 100%
  }
  
  #FOOTER.secondPage {
    top: 56px!important
  }
  
  .sp_function {
    height: auto!important
  }
  
  .wrapper {
    background: #FFF
  }
  .wrapper .bnr_area, .wrapper h3 {
    border-radius: 6px;
    background: #e5e5e5
  }
  .wrapper h3 {
    font-size: 16px;
    padding: 5px 10px;
    font-weight: 700;
    margin: 0 0 15px
  }
  .wrapper .sbox {
    margin: 0 12px 24px
  }
  .wrapper .bnr_area {
    padding: 2%;
    margin: 10px
  }
  .wrapper .bnr_area li {
    list-style: none;
    margin: 0 0 15px
  }
  .wrapper .bnr_area li:last-child {
    margin: 0
  }
  .wrapper .bnr_area li img {
    width: 100%;
    vertical-align: bottom
  }
  .wrapper .bnr_area li a {
    display: block;
    background: #FFF
  }
  .wrapper .bnr_area li a img {
    -webkit-transition: all 160ms ease-in-out;
    transition: all 160ms ease-in-out
  }
  .wrapper .bnr_area li a:hover img {
    opacity: .5
  }
  
  ul.company_list,
ul.business_list {
    margin:0;
    padding: 0;
    list-style-type: none;
}

ul.company_list li,
ul.business_list  li {
    list-style-type: none;
    margin-bottom: 6px;
}

ul.company_list li dl dt {
    float: none;
    width: auto;
    background:#E3E3E3;
    padding: 8px 12px;
}

ul.company_list li dl dd {
    background: #fff;
    padding: 8px 12px;
    margin-left: 0;
    }
}

.ma_t2 {
  margin-top: 2px
}

.ma_t4 {
  margin-top: 4px
}

.ma_t6 {
  margin-top: 6px
}

.ma_t8 {
  margin-top: 5px
}

.ma_t10 {
  margin-top: 10px
}

.ma_t12 {
  margin-top: 12px
}

.ma_t14 {
  margin-top: 14px
}

.ma_t16 {
  margin-top: 16px
}

.ma_t18 {
  margin-top: 18px
}

.ma_t20 {
  margin-top: 20px
}

.ma_t25 {
  margin-top: 25px
}

.ma_t30 {
  margin-top: 30px
}

.ma_t40 {
  margin-top: 40px
}

.ma_b2 {
  margin-bottom: 2px
}

.ma_b4 {
  margin-bottom: 4px
}

.ma_b6 {
  margin-bottom: 6px
}

.ma_b8 {
  margin-bottom: 8px
}

.ma_b10 {
  margin-bottom: 10px
}

.ma_b12 {
  margin-bottom: 12px
}

.ma_b14 {
  margin-bottom: 14px
}

.ma_b16 {
  margin-bottom: 16px
}

.ma_b18 {
  margin-bottom: 18px
}

.ma_b20 {
  margin-bottom: 20px
}

.ma_l2 {
  margin-left: 2px
}

.ma_l4 {
  margin-left: 4px
}

.ma_l6 {
  margin-left: 6px
}

.ma_l8 {
  margin-left: 8px
}

.ma_l10 {
  margin-left: 10px
}

.ma_l12 {
  margin-left: 12px
}

.ma_l14 {
  margin-left: 14px
}

.ma_l16 {
  margin-left: 16px
}

.ma_l18 {
  margin-left: 18px
}

.ma_l20 {
  margin-left: 20px
}

.ma_l40 {
  margin-left: 40px
}

.ma_r2 {
  margin-right: 2px
}

.ma_r4 {
  margin-right: 4px
}

.ma_r6 {
  margin-right: 6px
}

.ma_r8 {
  margin-right: 8px
}

.ma_r10 {
  margin-right: 10px
}

.ma_r12 {
  margin-right: 12px
}

.ma_r14 {
  margin-right: 14px
}

.ma_r16 {
  margin-right: 16px
}

.ma_r18 {
  margin-right: 18px
}

.ma_r20 {
  margin-right: 20px
}

.pa_t2 {
  padding-top: 2px
}

.pa_t4 {
  padding-top: 4px
}

.pa_t6 {
  padding-top: 6px
}

.pa_t8 {
  padding-top: 5px
}

.pa_t10 {
  padding-top: 10px
}

.pa_t12 {
  padding-top: 12px
}

.pa_t14 {
  padding-top: 14px
}

.pa_t16 {
  padding-top: 16px
}

.pa_t18 {
  padding-top: 18px
}

.pa_t20 {
  padding-top: 20px
}

.pa_t25 {
  padding-top: 25px
}

.pa_t30 {
  padding-top: 30px
}

.pa_t40 {
  padding-top: 40px
}

.pa_b2 {
  padding-bottom: 2px
}

.pa_b4 {
  padding-bottom: 4px
}

.pa_b6 {
  padding-bottom: 6px
}

.pa_b8 {
  padding-bottom: 8px
}

.pa_b10 {
  padding-bottom: 10px
}

.pa_b12 {
  padding-bottom: 12px
}

.pa_b14 {
  padding-bottom: 14px
}

.pa_b16 {
  padding-bottom: 16px
}

.pa_b18 {
  padding-bottom: 18px
}

.pa_b20 {
  padding-bottom: 20px
}

.pa_l2 {
  padding-left: 2px
}

.pa_l4 {
  padding-left: 4px
}

.pa_l6 {
  padding-left: 6px
}

.pa_l8 {
  padding-left: 8px
}

.pa_l10 {
  padding-left: 10px
}

.pa_l12 {
  padding-left: 12px
}

.pa_l14 {
  padding-left: 14px
}

.pa_l16 {
  padding-left: 16px
}

.pa_l18 {
  padding-left: 18px
}

.pa_l20 {
  padding-left: 20px
}

.pa_l40 {
  padding-left: 40px
}

.pa_r2 {
  padding-right: 2px
}

.pa_r4 {
  padding-right: 4px
}

.pa_r6 {
  padding-right: 6px
}

.pa_r8 {
  padding-right: 8px
}

.pa_r10 {
  padding-right: 10px
}

.pa_r12 {
  padding-right: 12px
}

.pa_r14 {
  padding-right: 14px
}

.pa_r16 {
  padding-right: 16px
}

.pa_r18 {
  padding-right: 18px
}

.pa_r20 {
  padding-right: 20px
}

.dark-tooltip {
  display: none;
  position: absolute;
  z-index: 99;
  text-decoration: none;
  font-weight: 400;
  height: auto;
  top: 0;
  left: 0
}

.dark-tooltip.small {
  padding: 4px;
  font-size: 12px;
  max-width: 150px;
  border-radius: 2px
}

.dark-tooltip.medium {
  padding: 10px;
  font-size: 14px;
  max-width: 250px;
  border-radius: 4px
}

.dark-tooltip.large {
  padding: 16px;
  font-size: 16px;
  max-width: 250px;
  border-radius: 6px
}

.dark-tooltip .tip {
  -webkit-transform: scale(1.01);
  transform: scale(1.01);
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
  line-height: 0
}

.dark-tooltip.south .tip {
  left: 50%;
  top: 100%
}

.dark-tooltip.west .tip {
  left: 3px;
  top: 50%
}

.dark-tooltip.north .tip {
  left: 50%;
  top: 0
}

.dark-tooltip.east .tip {
  left: 100%;
  top: 50%
}

.dark-tooltip.south.small .tip {
  border-width: 7px 5px 0;
  margin-left: -5px
}

.dark-tooltip.south.medium .tip {
  border-width: 8px 6px 0;
  margin-left: -6px
}

.dark-tooltip.south.large .tip {
  border-width: 14px 12px 0;
  margin-left: -12px
}

.dark-tooltip.west.small .tip {
  border-width: 5px 7px 5px 0;
  margin-left: -7px;
  margin-top: -5px
}

.dark-tooltip.west.medium .tip {
  border-width: 6px 8px 6px 0;
  margin-left: -6px;
  margin-top: -6px
}

.dark-tooltip.west.large .tip {
  border-width: 12px 14px 12px 0;
  margin-left: -14px;
  margin-top: -12px
}

.dark-tooltip.north.small .tip {
  border-width: 0 5px 7px;
  margin-left: -5px;
  margin-top: -7px
}

.dark-tooltip.north.medium .tip {
  border-width: 0 6px 8px;
  margin-left: -6px;
  margin-top: -8px
}

.dark-tooltip.north.large .tip {
  border-width: 0 12px 14px;
  margin-left: -12px;
  margin-top: -14px
}

.dark-tooltip.east.small .tip {
  border-width: 5px 0 5px 7px;
  margin-top: -5px
}

.dark-tooltip.east.medium .tip {
  border-width: 6px 0 6px 8px;
  margin-top: -6px
}

.dark-tooltip.east.large .tip {
  border-width: 12px 0 12px 14px;
  margin-top: -12px
}

.dark-tooltip ul.confirm {
  list-style-type: none;
  display: inline-block;
  margin: 0 auto
}

.dark-tooltip ul.confirm li {
  padding: 10px;
  float: left;
  margin: 5px;
  min-width: 25px;
  border-radius: 3px
}

.dark-tooltip.dark {
  background-color: #6288c6;
  color: #fff
}

.dark-tooltip.light {
  background-color: #ebedf3;
  color: #1B1E24
}

.dark-tooltip.dark.south .tip {
  border-color: #6288c6 transparent transparent;
  margin-top: -6px
}

.dark-tooltip.dark.west .tip {
  border-color: transparent #6288c6 transparent transparent
}

.dark-tooltip.dark.north .tip {
  border-color: transparent transparent #6288c6
}

.dark-tooltip.dark.east .tip {
  border-color: transparent transparent transparent #6288c6
}

.dark-tooltip.light.south .tip {
  border-color: #ebedf3 transparent transparent
}

.dark-tooltip.light.west .tip {
  border-color: transparent #ebedf3 transparent transparent
}

.dark-tooltip.light.north .tip {
  border-color: transparent transparent #ebedf3
}

.dark-tooltip.light.east .tip {
  border-color: transparent transparent transparent #ebedf3
}

.dark-tooltip.dark ul.confirm li {
  background-color: #416E85
}

.dark-tooltip.dark ul.confirm li:hover {
  background-color: #417E85
}

.dark-tooltip.light ul.confirm li {
  background-color: #C1DBDB
}

.dark-tooltip.light ul.confirm li:hover {
  background-color: #DCE8E8
}

.animated {
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-duration: .5s;
  animation-duration: .5s
}













.mvt01 {
	font-size: 48px;
	line-height: 150%;
	color: #fff;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.mvt02 {
	font-size: 72px;
	color: #fff;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	line-height: 150%;
}

.wrapbox {
    display: flex;
}

.column {
  height: 500px;
  width: 100%;
}
.cat1 {
	background-color: #232323;
background-size: cover;
	
}
.cat2 {
  background-image: url("../images/ph01.jpg");
  background-size: cover;
}
.cat3 {
	background-image: url("../images/ph02.jpg");
background-size: cover;
	
}
.cat4 {
 background-color: #232323;
  background-size: cover;
}
.cat5 {
	background-color: #232323;
background-size: cover;
	
}
.cat6 {
  background-image: url("../images/ph03.jpg");
  background-size: cover;
}
.cat7 {
	background-image: url("../images/ph04.jpg");
background-size: cover;
	
}
.cat8 {
 background-color: #232323;
  background-size: cover;
}

.infobox {
	text-align: center;
	color: #fff;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	margin-top: 140px;
	
}
.infobox02 {
	text-align: center;
	color: #fff;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	margin-top: 100px;
	
}
.infobox h2,
.infobox02 h2 {
	color:#d1c0a5;
	font-size: 16px;
	margin-bottom: 15px;
}
.infobox h3,
.infobox02 h3 {
	color:#fff;
	font-size: 30px;
	margin-bottom: 20px;
}
.infobox p,
.infobox02 p {
	color:#fff;
	line-height: 190%;
	font-size: 16px;
	margin-bottom: 20px;
}

.cpoint {
	border: 1px solid #d1c0a5;
	padding: 8px;
	text-align: center;
	font-size: 16px;
	width: 50%;
	margin: 0px auto 5px auto;
}

.wrapbox02 {
	width: 950px;
	margin: auto;
	
}


.infobox03 {
	text-align: center;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	margin-top: 0px;
}
.infobox03 h2 {
	color:#d1c0a5;
	font-size: 16px;
	margin-bottom: 15px;
}

.infobox03 h3 {
	font-size: 30px;
	margin-bottom: 20px;
}

.infobox03 p {
	line-height: 190%;
	font-size: 16px;
	margin-bottom: 20px;
}


.slider-wrapper {
  overflow: hidden;
}

.slider {
  position: relative;
  left: 15vw; /* (100vw - SlideWidth) / 2 */ /* 20180210 変更 */
  overflow: visible !important;
}

.slide {
  width: 70vw !important;
  
}





.c-both {
    clear:both; display:block; visibility:hidden;
}

.disnone {
	display: none;
}


.footer_wrap {
	width: 950px;
	margin: auto;
	padding-top: 40px;
}

.footer_wrap h2 {
	text-align: center;
	margin-bottom: 40px;
}
.footer_wrap h3 {
	text-align: center;
	margin-bottom: 10px;
	color: #b28850;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.footer_wrap ul {
    text-align: center;
    margin: 20px 0 30px;
    padding: 0;
}

.footer_wrap ul li {
    display: inline-block;
    margin-left: 10px;
    margin-left: 10px;
    color: #fff;
    font-size: 16px;
}

.footer_wrap ul li a {
    color: #fff;
}

.footer_wrap ul li a:hover {
    color:#9f0000;
    text-decoration: none;
}


#gaiyou {
	width: 100%;
	font-size: 16px;
	line-height: 180%;
	margin-bottom: 20px;
	color: #fff;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	margin-bottom: 40px;
}

dl#gaiyou dl,dl#gaiyou dt,dl#gaiyou dd {
	margin: 0;
	padding: 0;
}

dl#gaiyou dt,dl#gaiyou dd {
	padding: 15px;
}

dl#gaiyou dt {
	border-top: 1px solid #E3E3E3;
	clear: left;
	float: left;
	width: 30%;
}

dl#gaiyou dd {
	border-top: 1px solid #E3E3E3;
	margin-left:30%;
	
}

.fmap {
	margin-bottom: 40px;
}


ul#category  {
	list-style: none;
    display: flex;
    flex-flow: wrap;
    justify-content: space-between;
	width: 200px;
	margin: auto;
	margin-bottom: 40px;
}
ul#category li {
	
    box-sizing: border-box;
    width: 25px;
	margin: 10px auto 10px auto;
	line-height: 150%;
	text-align: center;
}

.fcopy {
	color: #fff;
	padding-bottom: 40px;
	text-align: center;
	font-size: 12px;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}


/* フローティングバナーのラップ要素 */
#fixed_right_banner
{
    /* 右端の上から20pxの位置に固定表示 */
    position: fixed;
    top: 300px;
    right: 0;
	z-index: 1000000;
}
 
/* 画像の共通設定 */
#fixed_right_banner > *
{
    /* 横幅 */
    width: 60px;
}
 
/* 2個目以降の画像の上部に余白を作る */
#fixed_right_banner > * ~ * { margin-top: 10px; }
 
/* リンク要素 */
#fixed_right_banner > a
{
    /* ブロック要素に変更 */
    display: block;
 
    /* 透過変更をスムーズにする(任意) */
   -webkit-transition: opacity .2s ease;
   transition: opacity .2s ease;
}
 
/* マウスオーバー時の表現 */
#fixed_right_banner > a:hover
{
    /* 20%透過させる */
    opacity: .8;
}
 
/* コンテンツに被らないようにするメディアクエリ */
@media (max-width: 1155px)
{
    #fixed_right_banner { display: none; }
}


@media print, screen and (min-width:641px) and (max-width:768px) {
.mvt01 {
	font-size: 32px;
	line-height: 150%;
	color: #fff;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.mvt02 {
	font-size: 48px;
	color: #fff;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	line-height: 150%;
}
	
.wrapbox {
    display: flex;
}

.column {
  height: 500px;
  width: 100%;
}
.cat1 {
	background-color: #232323;
background-size: cover;
	
}
.cat2 {
  background-image: url("../images/ph01.jpg");
  background-size: cover;
}
.cat3 {
	background-image: url("../images/ph02.jpg");
background-size: cover;
	
}
.cat4 {
 background-color: #232323;
  background-size: cover;
}
.cat5 {
	background-color: #232323;
background-size: cover;
	
}
.cat6 {
  background-image: url("../images/ph03.jpg");
  background-size: cover;
}
.cat7 {
	background-image: url("../images/ph04.jpg");
background-size: cover;
	
}
.cat8 {
 background-color: #232323;
  background-size: cover;
}

.infobox {
	text-align: center;
	color: #fff;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	margin: auto;
	margin-top: 140px;
	width: 90%;
	
	
}
.infobox02 {
	text-align: center;
	color: #fff;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	margin: auto;
	margin-top: 100px;
	width: 90%;
	
}
.infobox h2,
.infobox02 h2 {
	color:#d1c0a5;
	font-size: 14px;
	margin-bottom: 15px;
}
.infobox h3,
.infobox02 h3 {
	color:#fff;
	font-size: 20px;
	margin-bottom: 20px;
}
.infobox p,
.infobox02 p {
	color:#fff;
	line-height: 190%;
	font-size: 14px;
	margin-bottom: 20px;
}

.cpoint {
	border: 1px solid #d1c0a5;
	padding: 8px;
	text-align: center;
	font-size: 14px;
	width: auto;
	margin: 0px auto 5px auto;
}

.wrapbox02 {
	width: auto;
	margin: auto;
	
}


.infobox03 {
	text-align: center;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	margin-top: 0px;
}
.infobox03 h2 {
	color:#d1c0a5;
	font-size: 16px;
	margin-bottom: 15px;
}

.infobox03 h3 {
	font-size: 20px;
	margin-bottom: 20px;
}

.infobox03 p {
	line-height: 190%;
	font-size: 14px;
	margin-bottom: 20px;
}




.bxslider li{
  width;100%;  /* 画像サイズと同じ（画像をくっつけて表示させる場合） */
}

.c-both {
    clear:both; display:block; visibility:hidden;
}

.disnone {
	display: none;
}


.footer_wrap {
	width: auto;
	margin: 0 40px;
	padding-top: 60px;
}

.footer_wrap h2 {
	text-align: center;
	margin-bottom: 40px;
}
.footer_wrap h3 {
	text-align: center;
	margin-bottom: 10px;
	color: #b28850;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}


#gaiyou {
	width: 100%;
	font-size: 16px;
	line-height: 180%;
	margin-bottom: 20px;
	color: #fff;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	margin-bottom: 40px;
}

dl#gaiyou dl,dl#gaiyou dt,dl#gaiyou dd {
	margin: 0;
	padding: 0;
}

dl#gaiyou dt,dl#gaiyou dd {
	padding: 15px;
}

dl#gaiyou dt {
	border-top: 1px solid #E3E3E3;
	clear: left;
	float: left;
	width: 30%;
}

dl#gaiyou dd {
	border-top: 1px solid #E3E3E3;
	margin-left:30%;
	
}

.fmap {
	margin-bottom: 40px;
}


ul#category  {
	list-style: none;
    display: flex;
    flex-flow: wrap;
    justify-content: space-between;
	width: 200px;
	margin: auto;
	margin-bottom: 40px;
}
ul#category li {
	
    box-sizing: border-box;
    width: 25px;
	margin: 10px auto 10px auto;
	line-height: 150%;
	text-align: center;
}

.fcopy {
	color: #fff;
	padding-bottom: 40px;
	text-align: center;
	font-size: 12px;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
	
ul#category02  {
	list-style: none;
    display: flex;
    flex-flow: wrap;
    justify-content: space-between;
	width: 200px;
	margin: auto;
	margin-bottom: 40px;
}
ul#category02 li {
	
    box-sizing: border-box;
    width: 40px;
	margin: 10px auto 10px auto;
	line-height: 150%;
	text-align: center;
}

}

@media print, screen and (min-width:0px) and (max-width:640px) {
	
.mvt01 {
	font-size: 5vw;
	line-height: 150%;
	color: #fff;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.mvt02 {
	font-size: 7vw;
	color: #fff;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	line-height: 150%;
}
	
.wrapbox {
    display: block;
}

.column {
  height: auto;
  width: 100%;
}
.cat1 {
background-color: #232323;
background-size: cover;
padding: 30px 0;
	
}
.cat2 {
  background-image: url("../images/ph01.jpg");
  background-size: cover;
	height: 200px;
}
.cat3 {
	background-image: url("../images/ph02.jpg");
background-size: cover;
	height: 200px;
	
}
.cat4 {
 background-color: #232323;
  background-size: cover;
	padding: 30px 0;
}
.cat5 {
	background-color: #232323;
background-size: cover;
	padding: 30px 0;
	
}
.cat6 {
  background-image: url("../images/ph03.jpg");
  background-size: cover;
	height: 200px;
}
.cat7 {
	background-image: url("../images/ph04.jpg");
background-size: cover;
	height: 200px;
	
}
.cat8 {
 background-color: #232323;
  background-size: cover;
	padding: 30px 0;
}

.infobox {
	text-align: center;
	color: #fff;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	margin: auto;
	width: 90%;
	
	
}
.infobox02 {
	text-align: center;
	color: #fff;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	margin: auto;
	width: 90%;
	
}
.infobox h2,
.infobox02 h2 {
	color:#d1c0a5;
	font-size: 4vw;
	margin-bottom: 15px;
}
.infobox h3,
.infobox02 h3 {
	color:#fff;
	font-size: 5vw;
	margin-bottom: 20px;
}
.infobox p,
.infobox02 p {
	color:#fff;
	line-height: 190%;
	font-size: 3.5vw;
	margin-bottom: 20px;
}

.cpoint {
	border: 1px solid #d1c0a5;
	padding: 8px;
	text-align: center;
	font-size: 14px;
	width: auto;
	margin: 0px auto 5px auto;
}

.wrapbox02 {
	width: auto;
	margin: auto;
	
}


.infobox03 {
	text-align: center;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	margin-top: 0px;
	padding-top: 30px;
	
}
.infobox03 h2 {
	color:#d1c0a5;
	font-size: 4vw;
	margin-bottom: 15px;
}

.infobox03 h3 {
	font-size: 5vw;
	margin-bottom: 20px;
}

.infobox03 p {
	line-height: 190%;
	font-size: 3.5vw;
	margin-bottom: 20px;
}


.slider-wrapper {
  overflow: hidden;
}

.slider {
  position: relative;
  left: 15vw; /* (100vw - SlideWidth) / 2 */ /* 20180210 変更 */
  overflow: visible !important;
}

.slide {
  width: 70vw !important;
  
}





.c-both {
    clear:both; display:block; visibility:hidden;
}

.disnone {
	display: none;
}


.footer_wrap {
	width: auto;
	margin: 0 10px;
	padding-top: 30px;
}

.footer_wrap h2 {
	text-align: center;
	width: 60%;
	margin: 0px auto 20px auto;
}

.footer_wrap h3 {
	text-align: center;
	margin-bottom: 10px;
	color: #b28850;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}


#gaiyou {
	width: 100%;
	font-size: 4vw;
	line-height: 180%;
	margin-bottom: 20px;
	color: #fff;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	margin-bottom: 40px;
}

dl#gaiyou dl,dl#gaiyou dt,dl#gaiyou dd {
	margin: 0;
	padding: 0;
}

dl#gaiyou dt,dl#gaiyou dd {
	padding: 10px;
}

dl#gaiyou dt {
	border-top: 1px solid #E3E3E3;
	clear: left;
	float: left;
	width: 20%;
	text-align: left;
}

dl#gaiyou dd {
	border-top: 1px solid #E3E3E3;
	margin-left:20%;
	text-align: left;
	
}

.fmap {
	margin-bottom: 40px;
}


ul#category  {
	list-style: none;
    display: flex;
    flex-flow: wrap;
    justify-content: space-between;
	width: 200px;
	margin: auto;
	margin-bottom: 40px;
}
ul#category li {
	
    box-sizing: border-box;
    width: 25px;
	margin: 10px auto 10px auto;
	line-height: 150%;
	text-align: center;
}
	
ul#category02  {
	list-style: none;
    display: flex;
    flex-flow: wrap;
    justify-content: space-between;
	width: 200px;
	margin: auto;
	margin-bottom: 40px;
}
ul#category02 li {
	
    box-sizing: border-box;
    width: 40px;
	margin: 10px auto 10px auto;
	line-height: 150%;
	text-align: center;
}

.fcopy {
	color: #fff;
	padding-bottom: 40px;
	text-align: center;
	font-size: 12px;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
	
.fmap iframe {
		height: 250px;
}
	
	
}


.cp_ipselect {
	overflow: hidden;
	width: 150px;
	margin: 0 auto;
	text-align: center;
	margin-top: -10px;
	
}
.cp_ipselect select {
	width: 100%;
	padding-right: 1em;
	cursor: pointer;
	text-indent: 0.01px;
	text-overflow: ellipsis;
	border: none;
	outline: none;
	background: transparent;
	background-image: none;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
	text-align: center;
	
}
.cp_ipselect select::-ms-expand {
    display: none;
}
.cp_ipselect.cp_sl03 {
	position: relative;
	background: #8f7553;
	color:#fff;
	
	
}
.cp_ipselect.cp_sl03::before {
	position: absolute;
	top: 1.2em;
	right: 0.8em;
	width: 0;
	height: 0;
	padding: 0;
	content: '';
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid #fff;
	pointer-events: none;
}
.cp_ipselect.cp_sl03 select {
	padding: 8px 38px 8px 8px;
	color:#fff;
	
}
.option2 {
background-color: #000;	
}





#concept,
#room,
#outline,
#access {
   padding-top: 90px;
   margin-top: -90px;
}
.sponly {
		display: none;
}

.hidden_lang{
	display:none;
}


@media print, screen and (min-width:641px) and (max-width:768px) {
.cp_ipselect {
	overflow: hidden;
	width: 90%;
	margin: 0 auto;
	text-align: center;
	margin-top: 10px;
	margin-bottom: 20px;
	
}
.cp_ipselect select {
	width: 100%;
	padding-right: 1em;
	cursor: pointer;
	text-indent: 0.01px;
	text-overflow: ellipsis;
	border: none;
	outline: none;
	background: transparent;
	background-image: none;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
	text-align: center;
}
.cp_ipselect select::-ms-expand {
    display: none;
}
.cp_ipselect.cp_sl03 {
	position: relative;
	background: #8f7553;
	
}
.cp_ipselect.cp_sl03::before {
	position: absolute;
	top: 1.2em;
	right: 0.8em;
	width: 0;
	height: 0;
	padding: 0;
	content: '';
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid #fff;
	pointer-events: none;
}
.cp_ipselect.cp_sl03 select {
	padding: 8px 38px 8px 8px;
	color: #fff;
}


.sponly {
		display: block;
}
	

	
}

@media print, screen and (min-width:0px) and (max-width:640px) {
.cp_ipselect {
	overflow: hidden;
	width: 90%;
	margin: 0 auto;
	text-align: center;
	margin-top: 10px;
	margin-bottom: 20px;
	
}
.sponly {
		display: block;
}
}


ul.bxslider {  
padding: 0;  
margin: 0;  
}  



.menu,
    .menu span {
    display: inline-block;
    -webkit-transition:all .4s;
    transition: all .4s;
    box-sizing: border-box;
    }

    .menu {
      position: fixed;
      top: 17px;
      right:  25px;
      width: 35px;
      height: 22px;
      z-index: 10;
		background:none;
		border:0
    }

    .menu span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #fff;
    z-index: 10;
    }

    .menu span:nth-of-type(1) {
    top: 0px;
    }

    .menu span:nth-of-type(2) {
    top: 10px;
    }

    .menu span:nth-of-type(3) {
    bottom: 0px;
    }

    .menu.active span:nth-of-type(1) {
    -webkit-transform: translateY(10px) rotate(45deg);
    transform: translateY(10px) rotate(45deg);
    }

    .menu.active span:nth-of-type(2) {
    opacity: 0;
    }

    .menu.active span:nth-of-type(3) {
    -webkit-transform: translateY(-10px) rotate(-45deg);
    transform: translateY(-10px) rotate(-45deg);
    }

    #nav {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 10;
    width: 100%;
    height: 100vh;
    opacity: 0;
    
		background-color: #1b1b1b;
    transition: all 0.3s ease-in-out;
    visibility:hidden;

    }

    #nav.active{
    right: 0;
    opacity: 1;
    -moz-transform: translateX(0);
    -webkit-transform: translateX(0);
    transform: translateX(0);
    visibility: visible;
    }

    #nav ul{
    margin:20px 0;
    padding:20px 0;
    }

    #nav ul li{
    list-style-type: none;
    }

    #nav ul li a{
    display: block;
    padding: 15px 0;
    transition: all 0.2s ease-in-out;
    text-align: center;
    text-decoration: none;
    color: #fff;
		border-bottom: 1px dotted #fff;
		font-size: 4.5vw;
    }
    #nav ul li a:hover {
   background-color: #001e42;
    }

.pconly {
	display: block;
}

@media print, screen and (min-width:641px) and (max-width:768px) {
.pconly {
	display: none;
}
.hidden_lang{
	display:none;
}
	
}

@media print, screen and (min-width:0px) and (max-width:640px) {
.pconly {
	display: none;
}
}

.link {
text-align:center;
margin:30px 0;
}
.link a {
color:#c3cf89;
}


table#table-01 {
    width: 100%;
    border-top: 1px #E3E3E3 solid;
    border-collapse: collapse;
    border-spacing: 0;
    color:#fff;
    text-align: left !important;
    margin-bottom:50px !important;
}

table#table-01 th {
    padding: 15px !important;
   border-top: 1px #E3E3E3 solid;
    text-align: left !important;
   
}
table#table-01 td {
    padding: 15px !important;
   border-top: 1px #E3E3E3 solid;
    text-align: left !important;
  
}


@media print, screen and (min-width:0px) and (max-width:640px) {
table#table-01 {
    width: 100%;
    border-top: 1px #E3E3E3 solid;
    border-collapse: collapse;
    border-spacing: 0;
    color:#fff;
    text-align: left !important;
    margin-bottom:50px !important;
}

table#table-01 th {
    padding: 15px !important;
   border-top: 1px #E3E3E3 solid;
    text-align: left !important;
    width:30% !important;
}
table#table-01 td {
    padding: 15px !important;
   border-top: 1px #E3E3E3 solid;
    text-align: left !important;
    width:70% !important;
}

}



.head_title {
	width: 820px;
	margin: auto;
}



#globalmenu {
	height: 54px;
	width: 100%;
	border-bottom-width: 0px;
	border-bottom-style: solid;
	border-bottom-color: #dcdcdc;
	background-color: #1b1b1b;
	display: block;
	z-index: 100;

}
 
 
#globalnavi{
	padding: 0;
	width: 950px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}  



#dropmenu{
  list-style-type: none;
  margin: 0px auto 0px;	
  padding: 0;
	
}
#dropmenu li{
  position: relative;
  width: calc(100% / 4);
  float: left;
  margin: 0;
  padding: 0;
  text-align: center;
	
	
}
#dropmenu li a{
	display: block;
	margin: 0;
	color: #fff;
	font-size: 16px;
	font-weight: bold;
	line-height: 54px;
	
}

.g_menu {
	
	border-left-width: 0px;
	border-left-style: solid;
	border-left-color: #001e42;
	color: #fff;
	
}

.menu_end {
	
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #0139b0;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #0139b0;
	
	color: #fff;
}

.s01 {
	background-image:url("../images/common/bg01.jpg");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 60px 0px;
}

.inner_box {
	width: 980px;
	margin: auto;
}
.inner_box p {
	font-size: 16px;
	margin-bottom: 16px;
}

.btmS {
	margin-bottom: 20px;
}

.btmM {
	margin-bottom: 40px;
}
.btmL {
	margin-bottom: 60px;
}



.s02 {
	background-color: #fff;
	padding: 60px 0px;
}

.box_title {
	font-size: 48px;
	font-weight: bold;
	margin-bottom: 40px;
	text-align: center;
}

.box_title02 {
	font-size: 42px;
	font-weight: bold;
	margin-bottom: 40px;
	text-align: center;
	color: #001e42;
}


.more {
	position: relative;
	display: inline-block;
	padding: 20px 20px;
	background-color: #001e42;
	border: 2px solid #001e42;
	color: #fff;
	text-align: center;
	text-decoration: none;
	transition: all .3s;
	margin-top:30px;
	margin-bottom:30px;
	width:600px;
	font-size:18px;
}
.more::after {
	position: absolute;
	top: 50%;
	right: .2em;
	content: '';
	margin-top: -5px;
	border: 7px solid transparent;
	border-top-width: 5px;
	border-bottom-width: 5px;
	border-left-color: #fff;
	transition: all .3s;
}
.more:link {
	color: #fff;
}
.more:visited {
	color: #fff;
}
.more:hover {
	background-color: #fff;
	color: #001e42;
	text-decoration:none;
}
.more:hover::after {
	border-left-color: #001e42;
}



.s03 {
	background-color: #fff;
	padding: 60px 0px;
	
}



.s04 {
	background-image:url("../images/common/bg02.jpg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 60px 0px;
	
}

.white {
	color: #fff;
}


.s05 {
	background-color: #fff;
	padding: 60px 0px 60px 0px;
	border-bottom: 1px solid #aaaaaa;
	
}

.s06 {
	background-color: #f5f5f5;
	padding: 60px 0px 60px 0px;

}


.s07 {
	background-color: #002450;
	padding: 60px 0px;
	
}


.box_title03 {
	font-size: 42px;
	font-weight: bold;
	margin-bottom: 40px;
	text-align: center;
	color: #fff;
}



.cta_button {
	width: 900px;
	margin: auto;
}
.cta01 {
	float: left;
}
.cta02 {
	float: right;
}
.pcon {
	display: block;
}
.spon {
	display: none;
}


@media print, screen and (min-width:641px) and (max-width:1024px) {

.head_title {
	width: 90%;
	margin: auto;
	
}
.head_title img {
	width: 100% !important;
	margin: auto;
}

#globalmenu {
	display: none;
}

	
.inner_box {
	width: auto;
	margin: auto 15px;
}
.inner_box p {
	font-size: 18px;
	margin-bottom: 32px;
}
	
.spimg img {
		width: 100%;
}
	
.btmM {
	margin-bottom: 20px;
}
.btmL {
	margin-bottom: 30px;
}
	


.box_title {
	font-size: 6vw;
	font-weight: bold;
	margin-bottom: 20px;
	text-align: center;
}

.box_title02 {
	font-size: 5.5vw;
	font-weight: bold;
	margin-bottom: 20px;
	text-align: center;
	color: #001e42;
}
	
	
.inner_box p {
	font-size: 4vw;
	margin-bottom: 16px;
}
	
.more {
	position: relative;
	display: inline-block;
	padding: 20px 20px;
	background-color: #001e42;
	border: 2px solid #001e42;
	color: #fff;
	text-align: center;
	text-decoration: none;
	transition: all .3s;
	margin-top:20px;
	margin-bottom:20px;
	width:80%;
	font-size:4.5vw;
}
.more::after {
	position: absolute;
	top: 50%;
	right: .2em;
	content: '';
	margin-top: -5px;
	border: 7px solid transparent;
	border-top-width: 5px;
	border-bottom-width: 5px;
	border-left-color: #fff;
	transition: all .3s;
}
.more:link {
	color: #fff;
}
.more:visited {
	color: #fff;
}
.more:hover {
	background-color: #fff;
	color: #001e42;
	text-decoration:none;
}
.more:hover::after {
	border-left-color: #001e42;
}
	

	
.pcon {
	display: none;
}
.spon {
	display: block;
}
	
	


.s04 {
	background-color: #001e42;
	padding: 20px 0px 30px 0px;
	
}
	
.s05 {
	background-color: #fff;
	padding: 30px 0px 30px 0px;
	border-bottom: 1px solid #aaaaaa;
	
}

.s06 {
	background-color: #f5f5f5;
	padding: 30px 0px 30px 0px;

}
	
.cta_button {
	width: auto;
	margin: auto 10px;
}
.cta01 {
	float: none;
	margin-bottom: 10px;
}
.cta02 {
	float: none;
}
	
}

@media print, screen and (min-width:0px) and (max-width:640px) {
.head_title {
	width: 90%;
	margin: auto;
}
	.head_title img {
	width: 90% !important;
	margin: auto;
}
	
#globalmenu {
	display: none;
}

	
.inner_box {
	width: auto;
	margin: auto 15px;
}
.inner_box p {
	font-size: 18px;
	margin-bottom: 32px;
}
	
.spimg img {
		width: 100%;
}
	
.btmM {
	margin-bottom: 20px;
}
.btmL {
	margin-bottom: 30px;
}
	


.box_title {
	font-size: 6vw;
	font-weight: bold;
	margin-bottom: 20px;
	text-align: center;
}

.box_title02 {
	font-size: 5.5vw;
	font-weight: bold;
	margin-bottom: 20px;
	text-align: center;
	color: #001e42;
}
	
	
.inner_box p {
	font-size: 4vw;
	margin-bottom: 16px;
}
	
.more {
	position: relative;
	display: inline-block;
	padding: 20px 20px;
	background-color: #001e42;
	border: 2px solid #001e42;
	color: #fff;
	text-align: center;
	text-decoration: none;
	transition: all .3s;
	margin-top:20px;
	margin-bottom:20px;
	width:80%;
	font-size:4.5vw;
}
.more::after {
	position: absolute;
	top: 50%;
	right: .2em;
	content: '';
	margin-top: -5px;
	border: 7px solid transparent;
	border-top-width: 5px;
	border-bottom-width: 5px;
	border-left-color: #fff;
	transition: all .3s;
}
.more:link {
	color: #fff;
}
.more:visited {
	color: #fff;
}
.more:hover {
	background-color: #fff;
	color: #001e42;
	text-decoration:none;
}
.more:hover::after {
	border-left-color: #001e42;
}
	
}
	
.pcon {
	display: none;
}
.spon {
	display: block;
}
	
	


.s04 {
	background-color: #001e42;
	padding: 20px 0px 30px 0px;
	
}
	
.s05 {
	background-color: #fff;
	padding: 30px 0px 30px 0px;
	border-bottom: 1px solid #aaaaaa;
	
}

.s06 {
	background-color: #f5f5f5;
	padding: 30px 0px 30px 0px;

}
	
	

	
.cta_button {
	width: auto;
	margin: auto 10px;
}
.cta01 {
	float: none;
	margin-bottom: 10px;
}
.cta02 {
	float: none;
}



}





@media (min-width: 361px) {
.head_title {
	width: 90%;
	margin: auto;
}
	.head_title img {
	width: 60% !important;
	margin: auto;
}
}


.header_menu {
	display: flex;
	list-style-type: none;
	position: relative;
	float: right;
}
.header_tel {
	width: 340px;
	margin-right: 20px;
}
.header_tel img {
	width: 340px;
}
.header_button {
	width: 220px;
	
}
.header_button img {
	width: 220px;
}

#mainvisual {
	background-image:url("../images/common/header_02.jpg");
	background-position: center;
	background-repeat: no-repeat;
	width: 100%;
	height: 790px;
	display: block;
}

.title01 {
	color: #fff;
	font-size: 40px;
	text-align: center;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	padding: 30px 0px;
	font-weight: bold;
}

ul.bullet {
	list-style: none;
}
.bullet li {
	color:#fff;
	font-size: 18px;
	border-bottom: 1px dotted #fff;
	padding-bottom: 10px;
	margin-bottom: 10px;
	
}
.bullet li:before {
  font-family: FontAwesome;
  content: '\f14a'; /* アイコンのunicode */
	font-size: 20px;
	padding-right: 10px;
}

.title02 {
	background-color: #000;
	color: #fff;
	font-size: 42px;
	text-align: center;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	padding: 30px 0px;
	font-weight: bold;
}

.wrap1200 {
	width: 1200px;
	margin: 0 auto;
}

.ktitle {
	background-color: #002450;
	padding: 10px 20px;
	color: #fff;
	border-top-right-radius: 16px;
	border-top-left-radius: 16px;
	font-size: 22px;
}


.kbg {
	background-color: #e3ebf5;
	padding: 30px;
	font-size: 16px;
	border-bottom-right-radius: 16px;
	border-bottom-left-radius: 16px;
	margin-bottom: 30px;
}

.kph {
	float: left;
	margin-right: 0px;
	margin-bottom: 20px;
	width: 230px;
}
.kdata {
	float: right;
	margin-left: 20px;
	margin-bottom: 20px;
	width: 650px;
}
.kdata02 {
	float: right;
	margin-left: 20px;
	margin-bottom: 20px;
	width: 420px;
}
.kph img {
	padding: 10px;
	background-color: #fff;
}

.kstep {
	color:#fff;
	font-size: 18px;
	background-color: #0255bf;
	text-align: center;
	padding: 5px 10px;
	border-radius: 30px;
	float: left;
	width: 80px;
	margin-right: 20px;
	
}
.kstep_title {
	font-size: 22px;
	margin-top: 3px;
	margin-bottom: 20px;
	font-weight: bold;
}

.kstep_title02 {
	border-bottom: 1px dotted #000;
	padding-bottom: 5px;
	margin-bottom: 10px;
	font-weight: bold;
	font-size: 20px;
}


.kstep_title03 {
	font-weight: bold;
	font-size: 18px;
	margin-bottom: 5px;
}
.kstep_title03 i {
	color:#0255bf;
	margin-right: 5px;
}
.kbg02 {
	background-color: #fff;
	padding: 30px;
	margin-bottom: 50px;
}

.kflex {
	display: flex;
	justify-content: space-between;
	margin-bottom: 50px;
}

.kflex img {
	float: left;
}
.kdata03 {
	float: right;
	margin-left: 20px;
	margin-bottom: 20px;
	width: 210px;
}

.s4_title {
	color: #00387b;
	font-size: 40px;
	text-align: center;
	line-height: 150%;
	margin-bottom: 20px;
	font-weight: bold;
}
.s4_title02 {
	font-size: 24px;
	text-align: center;
	line-height: 150%;
	margin-bottom: 40px;
	font-weight: bold;
}

.saport {
	display: flex;
	justify-content: space-between;
	margin-bottom: 20px;
}
.saportitem {
	background-color: #e8f4df;
	border-radius: 10px;
	padding: 20px;
	text-align: center;
	width: 28%;
}
.saportitem img {
	margin-bottom: 10px;
}
.saportitem p {
	font-size: 14px;
	text-align: left;
}
.sap_title {
	font-size: 20px;
	margin-bottom: 5px;
	font-weight: bold;
}

.txtS {
	font-size: 12px !important;
}

.kankyo {
	font-size: 14px;
	border-bottom: 1px solid #000;
	padding-bottom: 2px;
	margin-bottom: 5px;
}

.s05 p {
	font-size: 12px;
}

.responce {
	background-color: #fff;
	padding: 30px;
	border-radius: 10px;
	margin-bottom: 40px;
}

.s07 p {
	font-size: 12px;
	color: #fff;
}
#mainvisual_s {
	display: none;
}

ul#fbn  {
    list-style: none;
    display: none;
    flex-flow: wrap;
    width: 100%;
    justify-content: space-between;
}

@media print, screen and (min-width:0px) and (max-width:1024px) {
#mainvisual {
	background-image:url("../images/common/header_02.jpg");
	background-position: center;
	background-repeat: no-repeat;
	width: 100%;
	height: 790px;
	display: none;
}
#mainvisual_s {
	display: block;
	margin-top: 56px!important;
}
	
.title01 {
	color: #fff;
	font-size: 5vw;
	text-align: center;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	padding: 30px 0px;
	font-weight: bold;
}
	
.s01 {
	background-image:url("../images/common/bg01.jpg");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 20px 0px;
}
	
	
	
ul.bullet {
	list-style: none;
}
.bullet li {
	color:#fff;
	font-size: 4vw;
	border-bottom: 1px dotted #fff;
	padding-bottom: 8px;
	margin-bottom: 8px;
	
}
.bullet li:before {
  font-family: FontAwesome;
  content: '\f14a'; /* アイコンのunicode */
	font-size: 20px;
	padding-right: 10px;
}
	
	
.s02 {
	background-color: #fff;
	padding: 0px 0px;
}

.title02 {
	background-color: #000;
	color: #fff;
	font-size: 5vw;
	text-align: center;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	padding: 20px 0px;
	font-weight: bold;
}
	
.wrap1200 {
	width: auto;
	margin: 0 10px;
}
	
.s03 {
	background-color: #fff;
	padding: 20px 0px;
	
}
	
	
	
.ktitle {
	background-color: #002450;
	padding: 10px 15px;
	color: #fff;
	border-top-right-radius: 16px;
	border-top-left-radius: 16px;
	font-size: 5vw;
}

.kbg {
	background-color: #e3ebf5;
	padding: 15px;
	font-size: 4vw;
	border-bottom-right-radius: 16px;
	border-bottom-left-radius: 16px;
	margin-bottom: 20px;
}

.kph {
	float: none;
	margin-right: 0px;
	margin-bottom: 10px;
	width: auto;
	text-align: center;
}
.kdata {
	float: none;
	margin-left: 0px;
	margin-bottom: 10px;
	width: auto;
}
.kdata02 {
	float: none;
	margin-left: 0px;
	margin-bottom: 10px;
	width: auto;
}
.kph img {
	padding: 0px;
	width: 100%;
	background-color: #fff;
}

.kstep {
	color:#fff;
	font-size: 4.5vw;
	background-color: #0255bf;
	text-align: center;
	padding: 5px 0px;
	border-radius: 30px;
	float: none;
	width: 100%;
	margin-right: 20px;
	
}
.kstep_title {
	font-size: 4.5vw;
	margin-top: 3px;
	margin-bottom: 10px;
	font-weight: bold;
}

.kstep_title02 {
	border-bottom: 1px dotted #000;
	padding-bottom: 5px;
	margin-bottom: 5px;
	font-weight: bold;
	font-size: 4.5vw;
}


.kstep_title03 {
	font-weight: bold;
	font-size: 4.5vw;
	margin-bottom: 5px;
}
.kstep_title03 i {
	color:#0255bf;
	margin-right: 5px;
}
.kbg02 {
	background-color: #fff;
	padding: 15px;
	margin-bottom: 20px;
}

.kflex {
	display: block;
	justify-content: space-between;
	margin-bottom: 20px;
}

.kflex img {
	float: none;
	width: 100%;
	margin-bottom: 10px;
}
.kdata03 {
	float: none;
	margin-left: 0px;
	margin-bottom: 20px;
	width: auto;
}

.s4_title {
	color: #00387b;
	font-size: 5vw;
	text-align: center;
	line-height: 150%;
	margin-bottom: 20px;
	font-weight: bold;
}
.s4_title02 {
	font-size: 4vw;
	text-align: center;
	line-height: 150%;
	margin-bottom: 20px;
	font-weight: bold;
}

.saport {
	display: block;
	justify-content: space-between;
	margin-bottom: 20px;
}
.saportitem {
	background-color: #e8f4df;
	border-radius: 10px;
	padding: 20px;
	text-align: center;
	width: auto;
	margin-bottom: 10px;
}
.saportitem img {
	margin-bottom: 10px;
}
.saportitem p {
	font-size: 3.5vw;
	text-align: left;
}
.sap_title {
	font-size: 4.5vw;
	margin-bottom: 5px;
	font-weight: bold;
}

.txtS {
	font-size: 3vw !important;
}

.kankyo {
	font-size: 3.5vw;
	border-bottom: 1px solid #000;
	padding-bottom: 2px;
	margin-bottom: 5px;
}

.s05 p {
	font-size: 12px;
}

.responce {
	background-color: #fff;
	padding: 10px;
	border-radius: 10px;
	margin-bottom: 20px;
}

.s07 p {
	font-size: 3vw;
	color: #fff;
}

.box_title03 {
	font-size: 5vw;
	font-weight: bold;
	margin-bottom: 20px;
	text-align: center;
	color: #fff;
}

.s07 {
	background-color: #002450;
	padding: 30px 0px;
	
}
	
.footer_guide {
	display: none;
	width:100%;
	padding-top: 0px;
	padding-bottom: 0px;
	color: #fff;
	background-color: none;
	text-align: center;
	position: fixed;
  bottom: 0;
	z-index: 2;
	
}

#footerFloatingMenu {
    display: block;
    width: 100%;
    position: fixed;
    left: 0px;
    bottom: 0px;
    z-index: 9999;
    text-align: center;
    padding: 0 auto;
}
 

	
ul#fbn  {
    list-style: none;
    display: flex;
    flex-flow: wrap;
    width: 100%;
    justify-content: space-between;
}
#footerFloatingMenu li {
box-sizing: border-box;
width: 33.3%;

}
#footerFloatingMenu li img {
width: auto;

}

ul.company_list,
ul.business_list{
    font-size: 16px;
}
	

}





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

@media print, screen and (min-width:0px) and (max-width:640px) {
}