@charset "utf-8";

body, th, td { font-family: "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif; }
h3 {
background: #0665bd;
border-radius: 3px;
color: #fff;
font-size: 14px;
letter-spacing: .1em;
line-height: 2.5em;
margin-bottom: 20px;
padding-left: 15px;
position: relative;
}

h3:before {
 position: absolute;
 top: 15px;
 left: 0;
 width: 10px;
 height: 5px;
 background: #fde4af;
 content: "";
}

h4 {
 border: 1px solid #ccc;
 border-radius: 3px;
 font-size: 14px;
 line-height: 2em;
 margin-bottom: 20px;
 padding-left: 15px;
 position: relative;
}

h4:before {
 position: absolute;
 top: 6px;
 left: 4px;
 width: 5px;
 height: 60%;
 background: #60a7dc;
 content: "";
}

h5 {
 background: #efefef;
 border-radius: 3px;
 font-size: 13px;
 line-height: 2em;
 margin-bottom: 20px;
 padding-left: 11px;
 }

caption { text-align: left; }

.main {
float: right;
line-height: 1.6;
min-height: 800px;
width: 680px;
}

.side {
float: left;
width: 240px;
}

.side h2 {
background: #0f3192;
color: #fff;
font-size: 16px;
font-weight: normal;
letter-spacing: .1em;
margin-bottom: 1px;
padding: 35px 0;
text-align: center;
}

/*responsive
-----------------------------------------------------*/

.smp { display: none; position: relative; }

@media screen and (max-width:949px) {
  .pc { display: none; }
  .smp { display: block; }
  .ib { display: inline-block; }
  #header .inner { width: 95%; }
  .main { float: none; min-height: 0; width: 100%; }
  .main img { height: auto; max-width: 100%; width: auto; }
  .smplink, a[href^="mailto:"] { border: 1px solid #999;
    border-radius: 5px;
    color: #666!important;
    line-height: 3em;
    padding: .5em 1em;
    text-decoration: none!important;
  }
  .side { display: none; }
  #header h1, #header .season, #header .txtnav, #header .gnav, #footer { display: none; }
  #breadcrumb { font-size: 11px; line-height: 1.6; width: 98%; }
  #container {
    margin: 0 auto 40px;
    clear: both;
    position: relative;
    width: 95%;
  }
  /* smp menu */
  #toggle, #toggle span { box-sizing: border-box; display: block; transition: all .4s; }
  #toggle { height: 24px; margin-top: -40px; float: right; position: relative; width: 25px; }
  #toggle span { background: #777; border-radius: 1px; height: 4px; left: 0; position: absolute; width: 100%;  }
  #toggle span:nth-of-type(1) { top: 0; }
  #toggle span:nth-of-type(2) { top: 10px; }
  #toggle span:nth-of-type(3) { bottom: 0; }
  #toggle.active span:nth-of-type(1) {
    -webkit-transform: translateY(10px) rotate(-45deg);
    transform: translateY(10px) rotate(-45deg);
  }
  #toggle.active span:nth-of-type(2) { opacity: 0; }
  #toggle.active span:nth-of-type(3) {
    -webkit-transform: translateY(-10px) rotate(45deg);
    transform: translateY(-10px) rotate(45deg);
  }
  .smpmenu { display: none; margin: 0 auto; overflow: hidden; margin-bottom: 1em; }
  .smpmenu ul {width: 100%;}
  .smpmenu li {
    box-sizing: border-box;
    border-bottom: 1px solid #fff;
    float: left;
    width: 50%;
  }
  .smpmenu li:nth-child(2n) { border-left: 1px solid #fff; }
  .smpmenu li a {
    background: #82b2de;
    color: #fff;
    display: block;
    font-size: 13px;
    line-height: 1;
    padding: 1.5em 0;
    text-align: center;
    text-decoration: none;
    transition: all .4s;
  }
  .smpmenu li a:hover { background: #0665bd; }
}