@charset "utf-8";

/* -----------------------------------------------
 * base.css
 * LastUpdate : 17/03/13
----------------------------------------------- */

* {
    box-sizing:border-box;
}

body {
  position: relative;
}

#base {
  overflow: hidden;
}

body {
	-webkit-text-size-adjust: 100%;
}
img {
    max-width: 100%;
    height: auto;
    width /***/:auto;　/*IE8のみ適用*/
}
img[src$=".svg"] {
    width: 100%;
}
#map_canvas img {
    max-width: auto !important;
}

#main section p {
  line-height: 2em;
}



@media only screen and ( max-width : 768px ) {
  .box {
    margin-bottom: 30px;
  }
  .sbox {
    margin-bottom: 20px;
  }
  .container {
    padding: 0 20px;
  }
  .sp_box {
    margin-bottom: 20px;
  }
  section {
    padding: 30px 0;
  }
}

@media only screen and ( max-width : 480px ) {
}

@media print, screen and ( min-width : 769px ) {
  .box {
    margin-bottom: 60px;
  }
  .sbox {
    margin-bottom: 30px;
  }
  .container {
    max-width: 1300px;
    min-width: 980px;
    padding: 0 40px;
  }
  #base {
    padding-top: 80px;
  }
  section {
    padding: 80px 0;
  }
  .span_inner {
    padding: 40px;
  }
}

/* ---------------------------------------------------------------------------------------------

　   HEADER

--------------------------------------------------------------------------------------------- */
#header {
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
  background: #fff;
  background: rgba(255,255,255,.9);
}
#gNav li a {
  display: block;
}
#gNav .entry {

}

#gNav .entry a {
  text-align: center;
  font-weight: 600;
  color: #fff;
  background-image: linear-gradient(to right, #56CCF2 0%, #2F80ED 51%, #56CCF2 100%);
  transition: all 0.5s ease 0s;
  background-size:200%;
}
#gNav .entry a:hover {
background-position: right center; 
  filter: alpha(opacity=100);
  -moz-opacity:1.0;
  opacity:1.0;
}

@media only screen and ( max-width : 768px ) {
  #header {
    height: 50px;
  }
  #logo {
    width: 230px;
    padding-left: 15px;
    padding-top: 7px;
  }
  #gNav {
    padding-top: 50px;
    border-left: 1px solid #ddd;
  }
  #gNav li {
    border-bottom: 1px solid #eee;
  }
  #gNav li:first-child {
    border-top: 1px solid #eee;
  }
  #gNav li a {
    padding: 10px;
    margin: 10px;
  }
  #gNav .entry {
    border-bottom: none;
    margin-top: 2em;
  }
  #gNav .entry a {
    padding: 20px 10px;
  }
  /**************
  ## Container ##
  **************/
  .pure-container {
    position: relative;
    height: 100%;
    -webkit-overflow-scrolling: touch;
  }

  /************
  ## Toggler ##
  ************/
  .pure-toggle {
    left: -9999px;
    position: absolute;
    top: -9999px;
  }

  .pure-toggle:focus ~ .pure-toggle-label {
    /*border-color: #1fc08e;
    color: #1fc08e;*/
  }

  .pure-toggle-label {
    display: none;
    cursor: pointer;
    display: block;
    position: fixed;
    z-index: 99;
    color: #006dbb;
    -webkit-transition: all 400ms ease-in-out;
            transition: all 400ms ease-in-out;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    width: 50px;
    height: 50px;
  }
  .pure-toggle-label p {
    position: absolute;
    bottom: 4px;
    font-size: 10px;
    right: 10px;
  }


  .pure-toggle-label:active {
    -webkit-tap-highlight-color: transparent;
  }

  .pure-toggle-label .pure-toggle-icon,
  .pure-toggle-label .pure-toggle-icon:before,
  .pure-toggle-label .pure-toggle-icon:after {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 2px;
    width: 25px;
    cursor: pointer;
    background: #006dbb;
    display: block;
    content: '';
    -webkit-transition: all 500ms ease-in-out;
            transition: all 500ms ease-in-out;
  }

  .pure-toggle-label .pure-toggle-icon {
    transform: translate3d(-50%, -5px, 0);
    -webkit-transform: translate3d(-50%, -5px, 0);
  }

  .pure-toggle-label .pure-toggle-icon:before {
    transform: translate3d(-50%, -8px, 0);
    -webkit-transform: translate3d(-50%, -8px, 0);
  }

  .pure-toggle-label .pure-toggle-icon:after {
    transform: translate3d(-50%, 6px, 0);
    -webkit-transform: translate3d(-50%, 6px, 0);
  }

  .pure-toggle-label[data-toggle-label='left'] {
    left: auto;
    right: 30px;
    top: 22px;
  }
  .pure-toggle-label[data-toggle-label='right'] {
    left: auto;
    right: 0px;
    top: 0px;
  }

  .pure-toggle[data-toggle='left']:checked ~ .pure-toggle-label:not([data-toggle-label='left']),
  .pure-toggle[data-toggle='right']:checked ~ .pure-toggle-label:not([data-toggle-label='right']) {
    opacity: 0;
    z-index: -1;
  }

  .pure-toggle[data-toggle='left']:checked ~ .pure-toggle-label[data-toggle-label='left'],
  .pure-toggle[data-toggle='right']:checked ~ .pure-toggle-label[data-toggle-label='right'] {
    /*border-color: #1fc08e;
    color: #1fc08e;*/
  }

  .pure-toggle[data-toggle='left']:checked ~ .pure-toggle-label[data-toggle-label='left'] .pure-toggle-icon,
  .pure-toggle[data-toggle='right']:checked ~ .pure-toggle-label[data-toggle-label='right'] .pure-toggle-icon {
    background-color: transparent;
  }

  .pure-toggle[data-toggle='left']:checked ~ .pure-toggle-label[data-toggle-label='left'] .pure-toggle-icon:before,
  .pure-toggle[data-toggle='left']:checked ~ .pure-toggle-label[data-toggle-label='left'] .pure-toggle-icon:after,
  .pure-toggle[data-toggle='right']:checked ~ .pure-toggle-label[data-toggle-label='right'] .pure-toggle-icon:before,
  .pure-toggle[data-toggle='right']:checked ~ .pure-toggle-label[data-toggle-label='right'] .pure-toggle-icon:after {
    top: 0;
  }

  .pure-toggle[data-toggle='left']:checked ~ .pure-toggle-label[data-toggle-label='left'] .pure-toggle-icon:before,
  .pure-toggle[data-toggle='right']:checked ~ .pure-toggle-label[data-toggle-label='right'] .pure-toggle-icon:before {
    transform: translateX(-50%) rotate(45deg);
    -webkit-transform: translateX(-50%) rotate(45deg);
  }

  .pure-toggle[data-toggle='left']:checked ~ .pure-toggle-label[data-toggle-label='left'] .pure-toggle-icon:after,
  .pure-toggle[data-toggle='right']:checked ~ .pure-toggle-label[data-toggle-label='right'] .pure-toggle-icon:after {
    transform: translateX(-50%) translateY(-10px) rotate(-45deg);
    -webkit-transform: translateX(-50%) translateY(-10px) rotate(-45deg);
    top: 10px;
  }

  /***********
  ## Drawer ##
  ***********/
  .pure-drawer {
    position: fixed;
    top: 0;
    /*left: 0;*/
    right: 0;
    z-index: 1;
    height: 100%;
    visibility: hidden;
    background-color: #fff;
    -webkit-transition-property: all;
            transition-property: all;
    -webkit-transition-duration: 500ms;
            transition-duration: 500ms;
    -webkit-transition-timing-function: ease-out;
            transition-timing-function: ease-out;
    width: 70%;
  }
  /*********************
  ## Pusher Container ##
  *********************/
  .pure-pusher-container {
    position: relative;
    height: 100%;
    overflow: hidden;
  }

  /***********
  ## Pusher ##
  ***********/
  .pure-pusher {
    position: relative;
    height: 100%;
    overflow-y: auto;
    left: 0;
    z-index: 2;
    background-color: #fff;
    -webkit-transition-property: -webkit-transform;
            transition-property: transform;
    -webkit-transition-duration: 500ms;
            transition-duration: 500ms;
    -webkit-transition-timing-function: ease-out;
            transition-timing-function: ease-out;
  }

  /*******************
  ## Pusher Overlay ##
  *******************/
  .pure-overlay {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    width: 0;
    height: 0;
    opacity: 0;
    background-color: rgba(255, 255, 255, 0.6);
    -webkit-transition-property: opacity;
            transition-property: opacity;
    -webkit-transition-duration: 500ms;
            transition-duration: 500ms;
    -webkit-transition-delay: 500ms;
            transition-delay: 500ms;
    -webkit-transition-timing-function: ease-in-out;
            transition-timing-function: ease-in-out;
  }

  .pure-toggle[data-toggle='left']:checked ~ .pure-overlay[data-overlay='left'] {
    left: 70%;
  }
  .pure-toggle[data-toggle='right']:checked ~ .pure-overlay[data-overlay='right'] {
    right: 70%;
  }

  .pure-toggle[data-toggle='left']:checked ~ .pure-overlay[data-overlay='left'],
  .pure-toggle[data-toggle='right']:checked ~ .pure-overlay[data-overlay='right'] {
    width: 100%;
    height: 100%;
    opacity: 1;
    z-index: 2;
  }

  /********************************
  ## Fallback for older browsers ##
  ********************************/
  .no-csstransforms3d .pure-toggle[data-toggle='left']:checked ~ .pure-pusher-container .pure-pusher {
    left: 100%;
  }
  .no-csstransforms3d .pure-toggle[data-toggle='right']:checked ~ .pure-pusher-container .pure-pusher {
    left: -100%;
  }


  /*********************
  ## Effect - Push ##
  *********************/
  /* DRAWER */
  [data-effect='pure-effect-push'] .pure-drawer {
    -webkit-transition-duration: 500ms;
            transition-duration: 500ms;
  }

  [data-effect='pure-effect-push'] .pure-drawer[data-position='left'] {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
  [data-effect='pure-effect-push'] .pure-drawer[data-position='right'] {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }


  [data-effect='pure-effect-push'] .pure-toggle[data-toggle='left']:checked ~ .pure-drawer[data-position='left'],
  [data-effect='pure-effect-push'] .pure-toggle[data-toggle='right']:checked ~ .pure-drawer[data-position='right'] {
    visibility: visible;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  /* PUSHER */
  [data-effect='pure-effect-push'] .pure-pusher-container .pure-pusher {
    -webkit-transition-duration: 500ms;
            transition-duration: 500ms;
  }

  [data-effect='pure-effect-push'] .pure-toggle[data-toggle='left']:checked ~ .pure-pusher-container .pure-pusher {
    -webkit-transform: translate3d(70%, 0, 0);
    transform: translate3d(70%, 0, 0);
  }
  [data-effect='pure-effect-push'] .pure-toggle[data-toggle='right']:checked ~ .pure-pusher-container .pure-pusher {
    -webkit-transform: translate3d(-70%, 0, 0);
    transform: translate3d(-70%, 0, 0);
  }

  /* OVERLAY */
  [data-effect='pure-effect-push'] .pure-overlay {
    -webkit-transition-duration: 500ms;
            transition-duration: 500ms;
    -webkit-transition-delay: 250ms;
            transition-delay: 250ms;
  }
}

@media only screen and ( max-width : 480px ) {
  
}

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

  }
  #header #logo {
    float: left;
    line-height: 80px;
    height: 80px;
    padding-left: 40px;
  }
  #header #logo img {
    vertical-align: middle;
  }
  #gNav {
    position: fixed;
    right: 0;
    top: 0;
    z-index: 999;
  }
  #gNav li {
    float: left;
    margin-right: 2em;
  }
  #gNav li:last-child {
    margin-right: 0;
  }
  #gNav .entry {
    width: 14em;
  }
  #gNav li a {
    line-height: 80px;
    position: relative;
    padding: 0 1em;
  }
  #gNav li a:hover,#gNav li.active a {
    color: #006dbb;
  }
  #gNav .entry a:hover {
    color: #fff;
  }
  #gNav li a:before,#gNav li.active a:before {
    position: absolute;
    bottom: 0;
    left: 0;
    content: "";
    display: inline-block;
    width: 0;
    height: 4px;
    background: #006dbb;
    transition: 0.5s;
  }
  #gNav li a:hover:before,#gNav li.active a:before {
    width: 100%;
  }
  .pure-toggle,.pure-toggle-label {
    display: none;
  }
}


/* ---------------------------------------------------------------------------------------------

　   CONTENTS

--------------------------------------------------------------------------------------------- */

h2 {
  color: #006dbb;
  text-align: center;
  /*font-weight: 700;*/
  /*background: #333;*/
  background:  -webkit-linear-gradient(45deg, rgba(129,252,255,1) 0%,rgba(0,109,187,1) 100%);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
    font-size: 3em;
}
.ie h2 {
  background: none;
  -webkit-text-fill-color: none;
  -webkit-background-clip: border-box;
}
@media all and (-ms-high-contrast: none){
  h2 {
    background: none;
    -webkit-text-fill-color: none;
    -webkit-background-clip: border-box;
  }
}
h2 span {
  display: block;
  text-align: center;
  /*color: #999;*/
  font-weight: 500;
  font-size: 0.333em;
}

h4 {
  font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
  font-weight: 700;
}

@media only screen and ( max-width : 768px ) {
  h2 {
    margin-bottom: .5em;
  }
  h4 {
    font-size: 1.2em;
    margin-bottom: 0.7em;
  }
}

@media only screen and ( max-width : 480px ) {
  h2 {
    font-size: 2.6em;
  }
}

@media print, screen and ( min-width : 769px ) {
  h2 {
    margin-bottom: 0.7em;
  }
  h4 {
    font-size: 1.4em;
    margin-bottom: 1.5em;
  }
}

/* ---------------------------------------------------------------------------------------------

　   FOOTER

--------------------------------------------------------------------------------------------- */
#footer {
  background: #061c2f;
  color: #fff;
}
#footer .container {
  text-align: center;
}
.copy {
  background: #051727;
  text-align: center;
}
@media only screen and ( max-width : 768px ) {
  #footer .container {
    padding: 20px;
  }
  #footer .container img {
    width: 180px;
  }
  .copy {
    padding: 15px;
    font-size: .8em;
  }
}

@media only screen and ( max-width : 480px ) {
  
}

@media print, screen and ( min-width : 769px ) {
  #footer .container {
    padding: 40px 0;
  }
  .copy {
    padding: 20px;
  }
  
}

/* ---------------------------------------------------------------------------------------------

　   PAGE TOP

--------------------------------------------------------------------------------------------- */
#pageTop {
  position: fixed;
  bottom: 0px;
  right: 0px;
  z-index: 9999;
  margin-bottom:5em;
}

#pageTop a {
  display: block;
  z-index: 999;
  width: 50px;
  height: 50px;
  line-height: 50px;
  background-color: #2F80ED;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
  background-image: linear-gradient(to right, #56CCF2 0%, #2F80ED 51%, #56CCF2 100%);
  background-size:200%;
}

#pageTop a:hover {
background-position: right center; 
  filter: alpha(opacity=100);
  -moz-opacity:1.0;
  opacity:1.0;
}

/* ---------------------------------------------------------------------------------------------

　   BUTTON

--------------------------------------------------------------------------------------------- */
.btn {
  transition: all 0.5s ease 0s;
  background-size:200%;
  color: #fff;
  display: block;
  text-align: center;
  position: relative;
  font-weight: 700;
  padding: 20px;
  margin: 0 auto;
  overflow:hidden;
  border:none;
  font-size: inherit;
}


.btn01 {
  /*background: #006dbb;*/
  background-image: linear-gradient(to right, #56CCF2 0%, #2F80ED 51%, #56CCF2 100%);
}

.btn:hover {
background-position: right center; 
  filter: alpha(opacity=100);
  -moz-opacity:1.0;
  opacity:1.0;
}

.btn02 {
  background-image: linear-gradient(to right, #F7971E 0%, #FFD200 51%, #F7971E 100%);
}




@media only screen and ( max-width : 768px ) {
  .btn {
    padding: 20px;
    font-size: 18px;
    min-width: 80%;
  }
}

@media only screen and ( max-width : 480px ) {
  .btn {
    padding: 15px;
    font-size: 15px;
    min-width: 100% !important;
  }
  .btn02 .backbtn {
    margin-bottom: 10px;
  }
  #pageTop {
	 margin-bottom:1em;
	 }
}

@media print, screen and ( min-width : 769px ) {
  .btn {
  }
  .btn.small {
    
  }
  .btn.midium {
    width: 400px;
  }
}

/* ---------------------------------------------------------------------------------------------

　   Entry

--------------------------------------------------------------------------------------------- */

#entry p strong {
  font-style: italic;
  color: #006dbb;
  display: block;
  margin-bottom: .5em;
}
#entry .ph {
  width: 100%;
}
#entry .btn {
  font-size: 1.4em;
}

@media only screen and ( max-width : 768px ) {
  #entry {
    background: #006dbb;
  }
  #entry h2 {
    background: none;
    -webkit-text-fill-color: #97FDFF;
    -webkit-background-clip: border-box;
  }
  #entry p {
    color: #fff;
  }
  #entry p strong {
    font-size: 2em;
    color: #97FDFF;
  }
}

@media only screen and ( max-width : 480px ) {
}

@media print, screen and ( min-width : 769px ) {
  #entry {
    padding: 0;
  }
  #entry .entry_inner {
    /*background: url(../img/entry_ph.jpg) no-repeat center;
    background-size: cover;*/
    padding: 40px 0 80px 0;
  }
  #entry h2 {
    background: #006dbb;
    -webkit-text-fill-color: #97FDFF;
    margin-bottom: 0;
    padding: 80px 0;
  }
  #entry p {
    text-align: center;
  }
  #entry p strong {
    font-size: 5em;
    font-weight: 700;
    display: block;
    text-align: center;
  }
  #entry p span {
    display: inline-block;
    background: #fff;
    padding: 0 5px;
  }
}
.ie #entry h2 {
  background: #006dbb;
  -webkit-text-fill-color: #97FDFF;
  -webkit-background-clip: border-box;
  color: #97FDFF;
}
@media all and (-ms-high-contrast: none){
  #entry h2 {
    background: #006dbb;
    -webkit-text-fill-color: #97FDFF;
    -webkit-background-clip: border-box;
  color: #97FDFF;
  }
}


/* ---------------------------------------------------------------------------------------------

　   アニメーション

--------------------------------------------------------------------------------------------- */

/*----- フェードインしながら上へスライド -----*/
.inviewfadeInUp {
    opacity: 0;
    -moz-transition: -moz-transform 0.5s linear;
    -webkit-transition: -webkit-transform 0.5s linear;
    -o-transition: -o-transform 0.5s linear;
    -ms-transition: -ms-transform 0.5s linear;
    transition: transform 0.5s linear;

  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.fadeInUp {
    opacity: 1;
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
  transition: .8s;
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate(0, 20px);
    -webkit-transform: translate(0, 20px);
  }

  to {
    opacity: 1;
    transform: translate(0, 0);
    -webkit-transform: translate(0, 0);
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate(0, 20px);
    -webkit-transform: translate(0, 20px);
  }

  to {
    opacity: 1;
    transform: translate(0, 0);
    -webkit-transform: translate(0, 0);
  }
}



@media only screen and ( max-width : 768px ) {
  
}

@media only screen and ( max-width : 480px ) {
  
}

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

/* ---------------------------------------------------------------------------------------------

　   XXXX

--------------------------------------------------------------------------------------------- */

@media only screen and ( max-width : 768px ) {
}

@media only screen and ( max-width : 480px ) {
}

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