body {
  -webkit-text-size-adjust: 100%;
} /*レスポンシブの場合*/
.fL {
  float: left;
}
.fR {
  float: right;
}
.pc {
  display: block;
}
.sp {
  display: none;
}
.wrap {
  max-width: 1080px;
  margin: 0 auto;
  text-align: left;
}
img {
  width: 100%;
  height: auto;
}
ol.normal {
  counter-reset: li;
  padding: 0;
  list-style: none;
}
ol.normal li {
  position: relative;
  margin: 0 0 20px 2em;
  padding: 4px 8px;
  border-top: 1px dotted #39f;
  background: #fff;
}
ol.normal li, ol.normal li span {
  font-weight: bold;
}
ol.normal li:before {
  content: counter(li);
  counter-increment: li;
  /* Position and style the number */
  position: absolute;
  top: -2px;
  left: -2em;
  width: 2em;
  padding: 4px 0;
  border-top: 2px solid #39f;
  color: #fff;
  background: #39f;
  font-weight: bold;
  font-family: "Helvetica Neue", Arial, sans-serif;
  text-align: center;
}
ul.normal li {
  margin-left: 20px;
  list-style-type: disc;
}
.block {
  display: block;
}
/*------------------------------------------------------------------------
font
------------------------------------------------------------------------*/
.s13 {
  font-size: 81.3%;
}
.s15 {
  font-size: 93.8%;
}
.s18 {
  font-size: 112.5%;
}
.s30 {
  font-size: 187.5%;
}
.marker_water {
  background: linear-gradient(transparent 40%, rgba(102, 204, 255, 0.5) 40%);
}
/*------------------------------------------------------------------------
color
------------------------------------------------------------------------*/
.white {
  color: #fff;
}
.navy {
  color: #001379;
}
.gray {
  color: #666;
}
.red {
  color: #C00;
}
.pink {
  color: #e8384d;
}
/*------------------------------------------------------------------------
余白
------------------------------------------------------------------------*/
.mab10 {
  margin-bottom: 10px;
}
.mab20 {
  margin-bottom: 20px;
}
.mab30 {
  margin-bottom: 30px;
}
.mab40 {
  margin-bottom: 40px;
}
.mab50 {
  margin-bottom: 50px;
}
@media all and (min-width: 1025px) {
  .pcmal30 {
    margin-left: 30px;
  }
}
/*------------------------------------------------------------------------
layout
------------------------------------------------------------------------*/
.w32 {
  width: 320px;
}
.w49 {
  width: 49%;
}
/*========== flex用*/
.flex {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: box;
  -js-display: flex;
  display: flex;
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
.flex2 {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: box;
  -js-display: flex;
  display: flex;
}
.flex3 {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: box;
  -js-display: flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
.flex4 {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: box;
  -js-display: flex;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
.reverse {
  -webkit-flex-direction: row-reverse;
  flex-direction: row-reverse;
}
.list2 li {
  width: 50%;
}
.list2-2 li {
  width: 48%;
}
.list2-3 li {
  width: 49.5%;
}
.list3 li {
  width: 32%;
}
.list3 li ul li {
  width: 100%;
}
.list4 li {
  width: 23%;
}
/*------------------------------------------------------------------------
header
------------------------------------------------------------------------*/
header {
  background: #02147A;
}
header .wrap {
  position: relative;
  padding-bottom: 20px;
}
header h1 {
  font-size: 87.5%;
  color: #fff;
  text-align: center;
  border-bottom: 1px solid #fff;
  padding: 5px 0;
}
header h2 {
  padding: 4% 0 5% 0;
  width: 18.51%;
  margin: 0 auto;
}
.contactbox {
  position: absolute;
  right: 0;
  top: 35px;
  text-align: left;
}
.contactbox p {
  font-size: 87.5%;
  color: #fff;
}
.contactbox p.tel {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 175%;
  font-weight: bold;
}
.contactbox p.tel span, .contactbox p.tel a, .contactbox p.tel a span {
  font-weight: bold;
  color: #fff;
  text-decoration: none;
}
.mail {
  position: relative;
}
.mail a::before {
  content: "\f0e0";
  position: absolute;
  left: 20px;
  font-family: FontAwesome;
}
.mail a {
  font-size: 112.5%;
  font-weight: bold;
  border: 5px solid;
  padding: 4% 4% 4% 20%;
  position: relative;
  width: 100%;
  display: block;
  box-sizing: border-box;
  text-decoration: none;
}
.mail a::after {
  position: absolute;
  top: 50%;
  right: 20px;
  display: block;
  content: '';
  width: 10px;
  height: 10px;
  margin-top: -6px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
/*------------------------------------------------------------------------
nav
------------------------------------------------------------------------*/
nav {
  width: 100%;
  background: #039;
}
nav ul {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: flex-start;
  max-width: 1080px;
  margin: 0 auto;
  padding: 1% 0;
  align-items: center;
}
nav ul li.navi, nav ul li.external {
  padding-right: 1.5%;
  margin-right: 3%;
  position: relative;
}
nav ul li:last-of-type {
  margin-left: auto;
}
nav ul li.navi::after {
  position: absolute;
  top: 50%;
  right: 0;
  display: block;
  content: '';
  width: 10px;
  height: 10px;
  margin-top: -8px;
  border-top: 2px solid #cc9;
  border-right: 2px solid #cc9;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
nav ul li.external::after {
  position: absolute;
  top: 40%;
  right: 0;
  display: block;
  width: 10px;
  height: 10px;
  margin-top: -12px;
  border: none !important;
  font-family: FontAwesome;
  content: '\f08e';
  color: #cc9;
}
nav ul li i {
  font-size: 200% !important;
  color: #fff;
}
nav ul li.icon {
  display: none;
  padding-right: 0 !important;
}
nav ul li i:hover {
  color: #cc6;
}
nav ul li a {
  text-decoration: none;
  color: #fff;
  font-weight: bold;
  display: block;
  width: 100%;
  height: 100%;
}
nav ul li a:visited {
  color: #fff;
}
nav ul li a:hover {
  color: #cc6;
}
/*------------------------------------------------------------------------
SNS
------------------------------------------------------------------------*/
.sns {
  background: #d2e4ff;
}
.sns ul li {
  display: inline-block;
  font-size: 250%;
  float: right;
  margin: 0 8px;
}
.sns ul li a, .sns ul li a:visited {
  color: #02147A;
}
.sns ul li a:hover {
  color: #cc6;
  -moz-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
  -webkit-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
  -ms-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
  text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
}
/*------------------------------------------------------------------------
パンくず
------------------------------------------------------------------------*/
#list {
  padding: 20px 0;
}
#list li {
  font-size: 81.3%;
  float: left;
}
#list li, #list li a, #list li a:visited {
  color: #666;
}
#list li a:hover {
  color: #000;
}
#list li span {
  padding: 0 20px;
}
/*------------------------------------------------------------------------
コンテンツ
------------------------------------------------------------------------*/
.bk01 {
  background: rgba(204, 204, 102, 0.1);
}
.bk02 {
  background: rgba(210, 228, 255, 0.3);
}
#other {
  background: url(../img/other_bk.gif) repeat-x;
}
#other h3 {
  font-size: 187.5%;
  font-weight: bold;
  padding-bottom: 50px;
}
#left {
  width: 67.59%;
}
aside {
  width: 27.77%;
}
#left, aside {
  padding: 40px 0;
}
.bike_ti, .snow_ti {
  font-size: 137.5%;
  font-weight: bold;
  margin-bottom: 8px;
}
.bike_ti:before {
  font-family: FontAwesome;
  content: '\f21c';
  font-weight: normal;
  font-size: 125%;
  padding-right: 10px;
}
.snow_ti:before {
  font-family: FontAwesome;
  content: '\f2dc';
  font-weight: normal;
  font-size: 125%;
  padding-right: 10px;
}
.sub {
  margin-bottom: 10px;
}
.sub span {
  background: #069;
  color: #fff;
  font-weight: bold;
  padding: .5% 1%;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
.link_bt a {
  font-size: 112.5%;
  font-weight: bold;
  border: 5px solid;
  padding: 4% 10%;
  position: relative;
  width: 100%;
  display: block;
  box-sizing: border-box;
  text-decoration: none;
}
.link_bt a::after {
  position: absolute;
  top: 50%;
  right: 20px;
  display: block;
  content: '';
  width: 10px;
  height: 10px;
  margin-top: -6px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.link_bt_white a {
  border-color: #fff;
  color: #fff;
}
.link_bt_white a:hover {
  border-color: #cc6;
  color: #cc6;
  -webkit-transition: all .5s;
  transition: all .5s;
}
.link_bt_white a::after {
  border-top: 3px solid #fff;
  border-right: 3px solid #fff;
}
.link_bt_white a:hover::after {
  border-top: 3px solid #cc6;
  border-right: 3px solid #cc6;
  -webkit-transition: all .5s;
  transition: all .5s;
}
.link_bt_navy a {
  border-color: #001379;
  color: #001379;
}
.link_bt_navy a:hover {
  border-color: #069;
  color: #069;
  -webkit-transition: all .5s;
  transition: all .5s;
}
.link_bt_navy a::after {
  border-top: 3px solid #001379;
  border-right: 3px solid #001379;
}
.link_bt_navy a:hover::after {
  border-top: 3px solid #069;
  border-right: 3px solid #069;
  -webkit-transition: all .5s;
  transition: all .5s;
}
.link_bt01 {
  width: 300px;
  margin: 10px auto;
}
.link_bt02 {
  width: 250px;
}
.link_bt03 {
  width: 100%;
}
.sidemenu {
  margin-bottom: 40px;
}
.sidemenu li {
  font-size: 93.8%;
  border-bottom: 2px dotted #333;
}
/*.sidemenu li a {
	color:#333;
	width:100%;
	display:block;
	line-height:40px;
	text-decoration:none;
	position:relative;
}*/
.sidemenu li a {
  color: #333;
  width: 100%;
  display: block;
  line-height: 140%;
  text-decoration: none;
  position: relative;
  padding: 5% 0;
}
.sidemenu li a::after {
  position: absolute;
  top: 50%;
  right: 10px;
  display: block;
  content: '';
  width: 10px;
  height: 10px;
  margin-top: -10px;
  border-top: 2px solid #02147A;
  border-right: 2px solid #02147A;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}
.sidemenu li a:hover {
  color: #069;
  -webkit-transition: all .5s;
  transition: all .5s;
}
.sidemenu li a:hover::after {
  border-top: 2px solid #C00;
  border-right: 2px solid #C00;
  -webkit-transition: all .5s;
  transition: all .5s;
}
#topcontrol {
  z-index: 999;
}
/*------------------------------------------------------------------------
footer
------------------------------------------------------------------------*/
footer {
  background: #02147A;
  text-align: left;
}
footer p {
  font-size: 87.5%;
  color: #fff;
  padding: 2% 0 2% 2%;
}
/*****************************************************************************************************************************
******************************************************************************************************************************
スマホ***********************************************************************************************************************/
@media all and (max-width: 799px) {
  .fL, .fR {
    float: none;
  }
  .pc {
    display: none;
  }
  .sp {
    display: block;
  }
  /*------------------------------------------------------------------------
layout
------------------------------------------------------------------------*/
  .w32 {
    width: 100%;
    max-width: 320px;
    margin: 0 auto;
  }
  .w49 {
    width: 100%;
  }
  .wrap {
    padding: 0 2%;
  }
  /*========== flex用*/
  .flex, .flex2, .flex3 {
    display: block;
  }
  .list2 li, .list3 li, .list2-2 li, .list2-3 li, .list4 li {
    width: 100%;
  }
  /*------------------------------------------------------------------------
header
------------------------------------------------------------------------*/
  header {
    padding: 70px 0 2% 0;
  }
  header .wrap {
    position: relative;
  }
  header h1 {
    text-align: left;
    border-bottom: none !important;
    padding: 5px 25% 5% 5%;
    position: absolute;
    top: -60px;
    font-size: 75%;
  }
  header h2 {
    width: 60%;
    margin: 1% auto;
  }
  .contactbox {
    position: relative;
    top: 0;
    width: 80%;
    /*border:1px solid #fff;*/
    padding: 1%;
    box-sizing: border-box;
    margin: 0 auto;
  }
  /*------------------------------------------------------------------------
nav
------------------------------------------------------------------------*/
  .inner {
    width: 100%;
    margin: 0 auto;
  }
  .inner:after {
    content: "";
    clear: both;
    display: block;
  }
  #top-head {
    width: 100%;
    margin: 0 auto;
    padding: 30px 0;
    line-height: 1;
    z-index: 999;
  }
  #top-head a, #top-head {
    color: #fff;
    text-decoration: none;
  }
  #top-head .inner {
    position: relative;
  }
  /* Btn Hover */
  #global-nav ul li:after {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 3px;
    bottom: -20px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
  }
  #global-nav ul li:hover:after {
    background: #fff;
    bottom: -30px;
  }
  /* Fixed */
  #top-head.fixed {
    margin-top: 0;
    top: 0;
    padding-top: 10px;
    height: 55px;
    background: #fff;
    background: rgba(0, 0, 0, .7);
    transition: top 0.65s ease-in;
    -webkit-transition: top 0.65s ease-in;
    -moz-transition: top 0.65s ease-in;
  }
  #top-head.fixed .logo {
    color: #333;
  }
  #top-head.fixed #global-nav ul li a {
    color: #333;
    padding: 0 20px;
  }
  /* Fixed Btn Hover */
  #top-head.fixed #global-nav ul li:after {
    bottom: -10px;
  }
  #top-head.fixed #global-nav ul li:hover:after {
    background: #0062B8;
    bottom: -20px;
  }
  /* Toggle Button */
  #nav-toggle {
    display: none;
    position: absolute;
    right: 12px;
    top: 5px;
    width: 44px;
    height: 46px;
    cursor: pointer;
    z-index: 101;
    background: #fff;
    border: 1px solid #fff;
  }
  #top-head.open #nav-toggle {
    top: 15px;
  }
  #nav-toggle div {
    position: relative;
    margin: 4px;
  }
  #nav-toggle span {
    display: block;
    position: absolute;
    height: 4px;
    width: 100%;
    background: #02147A;
    left: 0;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
  }
  #nav-toggle span:nth-child(1) {
    top: 3px;
  }
  #nav-toggle span:nth-child(2) {
    top: 15px;
  }
  #nav-toggle span:nth-child(3) {
    top: 27px;
  }
  #top-head, .inner {
    width: 100%;
    padding: 0;
  }
  #top-head {
    top: 10px;
    left: 0px;
    position: absolute;
    margin-top: 0;
  }
  #top-head.open {
    top: 0;
    position: absolute;
    margin-top: 0;
  }
  /* Fixed reset */
  #top-head.fixed {
    padding-top: 0;
    background: transparent;
  }
  #mobile-head {
    width: 100%;
    height: 56px;
    z-index: 999;
    position: relative;
  }
  #global-nav {
    position: absolute;
    top: -800px;
    background: rgba(0, 0, 51, 0.8);
    width: 100%;
    text-align: left;
    padding: 0;
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
  }
  #global-nav ul {
    list-style: none;
    position: static;
    right: 0;
    bottom: 0;
  }
  #global-nav ul li {
    float: none;
    position: static;
  }
  #global-nav ul li:after {
    display: none;
  }
  #top-head #global-nav ul li a, #top-head.fixed #global-nav ul li a {
    font-size: 100%;
    width: 100%;
    display: block;
    color: #fff;
    padding: 18px 0;
    text-indent: 10px;
  }
  #nav-toggle {
    display: block;
  }
  /* #nav-toggle 切り替えアニメーション */
  .open #nav-toggle span:nth-child(1) {
    top: 15px;
    -webkit-transform: rotate(315deg);
    -moz-transform: rotate(315deg);
    transform: rotate(315deg);
  }
  .open #nav-toggle span:nth-child(2) {
    width: 0;
    left: 50%;
  }
  .open #nav-toggle span:nth-child(3) {
    top: 15px;
    -webkit-transform: rotate(-315deg);
    -moz-transform: rotate(-315deg);
    transform: rotate(-315deg);
  }
  /* #global-nav スライドアニメーション */
  .open #global-nav {
    -moz-transform: translateY(556px);
    -webkit-transform: translateY(556px);
    transform: translateY(556px);
    padding: 320px 0 10px 0;
  }
  #global-nav ul li {
    float: none;
    width: 100%;
    border: none;
    box-sizing: border-box;
  }
  #global-nav ul li a {
    width: 96%;
    border-bottom: 1px solid #fff;
    position: relative;
  }
  #global-nav ul li a:hover, #global-nav ul li a:active {
    background: none;
  }
  nav ul {
    display: block;
  }
  nav ul li:lang(en) {
    text-align: left;
    padding: 1%;
    background: none;
    display: block;
  }
  nav {
    margin: 0;
    border-bottom: none;
  }
  nav ul li a span {
    display: none;
  }
  nav ul li a {
    text-decoration: none;
    color: #000;
    font-weight: bold;
    width: 100%;
    display: block;
  }
  #global-nav ul li a::after {
    position: absolute;
    top: 50%;
    right: 10px;
    display: block;
    content: '';
    width: 10px;
    height: 10px;
    margin-top: -4px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
  }
  #global-nav li.sp {
    display: block;
  }
  nav ul li.navi, nav ul li.external {
    padding-right: 0;
    margin-right: 0;
  }
  nav ul li.icon {
    display: block;
  }
  /*------------------------------------------------------------------------
パンくず
------------------------------------------------------------------------*/
  #list {
    display: none;
  }
  /*------------------------------------------------------------------------
コンテンツ
------------------------------------------------------------------------*/
  .link_bt01, .link_bt02 {
    width: 100%;
    margin: 10px auto;
  }
  #other {
    background-image: none;
  }
  #other h3 {
    padding-bottom: 0;
    background: #ebebeb;
	line-height: 80px;
  }
  #left, aside {
    width: 98%;
    margin: 0 auto;
  }
  .sidemenu li a::after {
    margin-top: -5px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
}