@charset "UTF-8";
/* CSS Document */
/*////////////////////////////////////////////////////////

Base Setting

////////////////////////////////////////////////////////*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  line-height: 160%; }

img {
  margin: 0;
  vertical-align: middle;
  border: none; }

p {
  margin: 0 0 1em 0;
  padding: 0; }

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

ul {
  list-style: none; }

a:hover {
  text-decoration: none;
  filter: alpha(opacity=80);
  -moz-opacity: 0.80;
  opacity: 0.80; }

.mb10 {
  margin-bottom: 10px !important; }

.mb20 {
  margin-bottom: 20px !important; }

.catch {
  display: block;
  margin: 0 0 20px 0;
  color: #D75B93;
  font-size: 1.5em;
  text-align: center; }

.attention {
  display: inline-block;
  margin: 0 3px;
  color: #294383;
  font-size: 1.325em; }

.red {
  color: #F00; }

@media screen and (max-width: 640px) {
  .catch {
    font-size: 1.1em; }

  .attention {
    margin: 0;
    font-size: 1.2em; } }
/*////////////////////////////////////////////////////////

Base layout

////////////////////////////////////////////////////////*/
html, body {
  position: relative; }

body {
  margin: 0;
  padding: 0;
  line-height: 1.6;
  color: #666;
  font: 16px/1.7 "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Meiryo,"メイリオ","ＭＳ Ｐゴシック",Helvetica,Sans-Serif;
  background: url(../images/body_bg.jpg) center -120px; }

#container {
  width: 100%;
  text-align: center; }

/* header
------------------------------------------------------- */
header {
  width: 100%;
  text-align: left; }
  header div {
    width: 960px;
    margin: 0 auto 10px;
    position: relative; }
    header div #text {
      margin-bottom: 0;
      color: #999;
      font-size: 12px;
      position: relative;
      top: 3px; }
    header div #site_title {
      margin-bottom: 0;
      font-size: 1.625rem;
      font-weight: bold; }
    header div #tel {
      position: absolute;
      top: 10px;
      right: 0; }

#tel {
  font-size: 0.925rem;
  text-align: right;
  line-height: 110%; }
  #tel span {
    display: block;
    color: #F69;
    font-size: 1.525rem;
    font-weight: bold; }

.open {
  display: none;
  width: 40px;
  height: 40px;
  padding-top: 26px;
  border-radius: 5px;
  box-sizing: border-box;
  box-shadow: inset 0 0 3px #000;
  color: #333;
  font-size: 0.3em;
  text-align: center;
  text-decoration: none;
  position: absolute;
  top: 10px;
  right: 5px;
  background: url(../images/icon_menu.png) center 5px no-repeat, -webkit-linear-gradient(#EEE, #CCC);
  background: url(../images/icon_menu.png) center 5px no-repeat, -moz-linear-gradient(#EEE, #CCC);
  background: url(../images/icon_menu.png) center 5px no-repeat, -o-linear-gradient(#EEE, #CCC);
  background: url(../images/icon_menu.png) center 5px no-repeat, -ms-linear-gradient(#EEE, #CCC);
  background: url(../images/icon_menu.png) center 5px no-repeat, linear-gradient(#EEE, #CCC);
  background-size: 23px auto, 100% auto; }

@media screen and (max-width: 640px) {
  header div {
    width: 100%;
    margin: 0;
    padding: 5px;
    box-sizing: border-box; }
    header div #site_title img {
      width: 250px;
      position: relative;
      top: -7px; }
    header div #text {
      color: #777;
      font-size: 0.7em;
      position: relative;
      top: 3px; }
      header div #text span {
        display: none !important; }
    header div #tel {
      display: none; } }
/* global navigation
------------------------------------------------------- */
header ul {
  width: 100%;
  margin-bottom: 10px;
  text-align: center;
  position: relative;
  overflow: hidden; }
  header ul li {
    float: left;
    width: 182px;
    margin: 0;
    padding: 0 5px;
    text-align: left;
    background: url(../images/gnav_text2.png) no-repeat; }
    header ul li:nth-child(1) {
      background-position: 0px 15px; }
    header ul li:nth-child(2) {
      background-position: -192px 15px; }
    header ul li:nth-child(3) {
      background-position: -384px 15px; }
    header ul li:nth-child(4) {
      background-position: -576px 15px; }
    header ul li:nth-child(5) {
      background-position: -768px 15px; }
    header ul li a {
      display: block;
      padding: 8px 0;
      text-indent: -9999px;
      border-bottom: 2px solid #94BC34; }
      header ul li a:hover {
        border-bottom: 2px solid #E58BD1; }

.drawer-hamburger {
  display: none !important; }

.nav_pp,
#nav_tel {
  display: none; }

@media screen and (max-width: 640px) {
  header ul {
    display: none; }

  .drawer-hamburger {
    display: block !important;
    background: #FFF !important;
    top: 5px !important; }

  .drawer-menu li {
    border-bottom: 1px dotted #CCC !important; }
    .drawer-menu li a {
      padding: 10px 5px !important;
      background: url(../images/nav_arrow.png) no-repeat 98% 14px;
      background-size: 8px auto; }

  .nav_pp {
    display: block !important; }

  .nav_tel {
    display: block;
    color: #333;
    font-size: 0.9em;
    border-bottom: none !important; }
    .nav_tel a {
      display: inline-block;
      width: 100%;
      margin: 15px auto 5px !important;
      padding: 5px 10px !important;
      color: #333 !important;
      border-radius: 5px;
      background: #CCC !important;
      box-sizing: border-box; } }
/* main visual
------------------------------------------------------- */
#main_visual {
  min-width: 960px;
  height: 150px;
  margin: 0 auto 20px;
  position: relative; }
  #main_visual img {
    margin-left: -485px;
    position: absolute;
    top: 40px;
    left: 50%; }

.main_text {
  margin-left: -485px;
  position: absolute;
  top: 40px;
  left: 50%;
  color: #333333;
  font-size: 34px;
  font-weight: bold;
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  text-shadow: 1px 1px 8px #FFF, -1px 1px 8px #FFF, 1px -1px 8px #FFF, -1px -1px 8px #FFF; }

.top {
  height: 250px !important;
  background: url(../images/main_visual_5.png) center no-repeat; }
  .top img {
    top: 80px !important; }

.news {
  background: url(../images/main_school.png) center no-repeat; }

.school {
  background: url(../images/main_school_2.png) center no-repeat; }

.lecturer {
  background: url(../images/main_lecturer.png) center no-repeat; }

.photo {
  background: url(../images/main_photo.png) center no-repeat; }

.contact {
  background: url(../images/main_contact.png) center no-repeat; }

.privacy {
  background: url(../images/main_contact.png) center no-repeat; }

#contact_btn {
  display: none; }

@media screen and (max-width: 640px) {
  #main_visual {
    min-width: 100%;
    height: 70px;
    margin-bottom: 10px;
    background-position: center top;
    background-size: 200% auto; }

  .top {
    height: 100px !important;
    margin-bottom: 10px;
    background-position: center top;
    background-size: 200% auto; }
    .top img {
      top: 30px !important; }

  #main_visual img {
    height: 35px;
    margin-left: 0px;
    position: absolute;
    top: 20px;
    left: 10px; }

  .main_text {
    margin-left: 0px;
    position: absolute;
    top: 20px;
    left: 10px;
    font-size: 24px; }

  #contact_btn {
    display: table;
    width: 100%;
    margin: 0 auto 50px;
    text-align: center;
    border-collapse: separate;
    border-spacing: 5px 0; }
    #contact_btn li {
      display: table-cell;
      width: 45%;
      vertical-align: middle;
      border-radius: 8px;
      background: -webkit-linear-gradient(#395BB7, #294282);
      background: -moz-linear-gradient(top, #395BB7, #294282);
      background: -o-linear-gradient(#395BB7, #294282);
      background: -ms-linear-gradient(#395BB7, #294282);
      background: linear-gradient(#395BB7, #294282);
      position: relative; }
      #contact_btn li:first-child {
        background: url(../images/icon_tel.png) 10px center no-repeat, -webkit-linear-gradient(#395BB7, #294282);
        background: url(../images/icon_tel.png) 10px center no-repeat, -moz-linear-gradient(top, #395BB7, #294282);
        background: url(../images/icon_tel.png) 10px center no-repeat, -o-linear-gradient(#395BB7, #294282);
        background: url(../images/icon_tel.png) 10px center no-repeat, -ms-linear-gradient(#395BB7, #294282);
        background: url(../images/icon_tel.png) 10px center no-repeat, linear-gradient(#395BB7, #294282);
        background-size: 2.5em auto, 100% auto; }
      #contact_btn li a {
        display: block;
        padding: 8px 5px;
        color: #FFF;
        line-height: 120%;
        text-decoration: none; }
      #contact_btn li span {
        display: block;
        width: 100%;
        color: #333;
        font-size: 0.8em;
        position: absolute;
        bottom: -25px; } }
/* bread crumb
------------------------------------------------------- */
#bread_crumb {
  width: 960px;
  margin: 0 auto 10px;
  text-align: left;
  position: relative; }
  #bread_crumb li {
    display: inline-block;
    margin-right: 10px;
    color: #333;
    font-size: 0.9em; }
    #bread_crumb li:after {
      content: '>';
      position: relative;
      top: -2px;
      left: 7px; }
    #bread_crumb li a, #bread_crumb li:last-child a, #bread_crumb li:last-child a:hover {
      color: #333;
      text-decoration: none; }
    #bread_crumb li:last-child:after {
      content: ''; }

@media screen and (max-width: 640px) {
  #bread_crumb {
    width: 100%;
    padding: 0 5px;
    box-sizing: border-box; } }
/* contents
------------------------------------------------------- */
#wrapper {
  width: 960px;
  margin: 0 auto 20px;
  padding-bottom: 80px;
  text-align: left;
  position: relative;
  overflow: hidden; }

#contents {
  float: left;
  width: 700px; }
  #contents article {
    margin-bottom: 20px;
    padding: 20px 20px 0;
    border: 1px solid #B89C97;
    box-shadow: 1px 1px 1px #FFF, 1px 1px 1px #FFF inset; }
    #contents article h1 {
      margin-bottom: 15px;
      color: #222; }
    #contents article h2 {
      margin-bottom: 15px;
      font-size: 1.225rem;
      font-weight: bold; }

.article_title {
  padding: 0 10px;
  font-size: 1.425rem;
  border-left: 5px solid #D75B93; }

.page_title {
  position: relative;
  padding-left: 15px;
  font-size: 24px;
  font-weight: bold;
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; }

.page_title:before {
  position: absolute;
  top: 4px;
  left: 0;
  display: block;
  content: '';
  width: 5px;
  height: 28px;
  background: #D75B93; }

.page-link {
  display: none; }

.link_page_navi {
  margin-bottom: 20px;
  text-align: center; }
  .link_page_navi li,
  .link_page_navi a {
    display: inline-block;
    width: 30px;
    padding: 3px 0 2px;
    border: 1px solid #999; }
    .link_page_navi li li,
    .link_page_navi a li {
      display: block;
      padding: 0;
      border: none; }
  .link_page_navi a {
    color: #FFF;
    text-decoration: none;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(1, #294383), color-stop(0, #395BB7));
    background: -webkit-linear-gradient(#395BB7, #294383);
    background: -moz-linear-gradient(#395BB7, #294383);
    background: -o-linear-gradient(#395BB7, #294383);
    background: -ms-linear-gradient(#395BB7, #294383);
    background: linear-gradient(#395BB7, #294383); }

@media screen and (max-width: 640px) {
  #wrapper {
    width: 100%; }

  #contents {
    float: none;
    width: 100%; }
    #contents article {
      margin: 0 5px 20px;
      padding: 10px 10px 0;
      border: 1px solid #B89C97;
      box-shadow: 1px 1px 1px #FFF, 1px 1px 1px #FFF inset; }
      #contents article h1 img {
        height: 25px; }
      #contents article h2 {
        margin-bottom: 10px;
        font-size: 1.125rem;
        font-weight: bold; } }
/* side navigation
------------------------------------------------------- */
nav {
  float: right;
  width: 240px;
  font-size: 0.8em; }
  nav section,
  nav aside {
    margin-bottom: 20px;
    padding: 10px;
    background: url(../images/nav_bg.png); }
  nav h2 {
    margin-bottom: 10px;
    border-bottom: 1px solid #987169; }
  nav ul li {
    border-bottom: 1px dotted #987169; }
    nav ul li:last-child {
      border-bottom: none; }
    nav ul li a {
      display: block;
      padding: 7px 15px 7px 5px;
      color: #333;
      text-decoration: none;
      background: url(../images/nav_arrow.png) no-repeat 98% 10px; }
  nav .banner_box {
    margin-bottom: 20px; }
  nav .banner_box img {
    margin-bottom: 5px; }

@media screen and (max-width: 640px) {
  nav {
    float: none;
    width: 100%;
    padding: 5px;
    font-size: 1em;
    box-sizing: border-box; } }
/* page top
------------------------------------------------------- */
#page-top {
  position: fixed;
  right: 30px;
  bottom: 20px; }
  #page-top a {
    display: block; }

@media screen and (max-width: 640px) {
  #page-top {
    right: 10px; }
    #page-top img {
      width: 40px; } }
/* footer
------------------------------------------------------- */
footer {
  padding: 10px;
  color: #FFF;
  text-align: center;
  background: url(../images/footer_bg.gif); }
  footer ul {
    margin-bottom: 30px; }
    footer ul li {
      display: inline-block; }
      footer ul li a {
        display: block;
        padding: 5px 10px;
        color: #FFF;
        text-decoration: none; }
  footer small {
    font-size: 0.8em; }

@media screen and (max-width: 640px) {
  footer {
    padding: 0; }
    footer ul {
      position: relative;
      overflow: hidden; }
      footer ul li {
        display: block;
        float: left;
        width: 50%;
        font-size: 0.8em;
        box-sizing: border-box;
        border-bottom: 1px dotted #999; }
        footer ul li:nth-child(odd) {
          border-right: 1px dotted #999; }
        footer ul li a {
          padding: 10px; }
    footer small {
      font-size: 0.7em;
      position: relative;
      top: -10px; } }
/*////////////////////////////////////////////////////////

contents layout

////////////////////////////////////////////////////////*/
/* list
------------------------------------------------------- */
.list_free li {
  padding-left: 1.5em;
  position: relative; }
  .list_free li span {
    position: absolute;
    top: 0;
    left: 0; }

/* contents link
------------------------------------------------------- */
.float_list {
  position: relative;
  overflow: hidden; }
  .float_list li {
    float: left;
    width: 320px;
    margin: 0 15px 0 0; }
    .float_list li:nth-child(even) {
      margin-right: 0; }
    .float_list li .contents_link {
      min-height: 330px; }
      .float_list li .contents_link dt {
        width: 100%;
        margin-bottom: 10px; }
      .float_list li .contents_link dd {
        width: 100%; }
      .float_list li .contents_link .btn_link {
        position: absolute;
        right: 0;
        bottom: 0; }

.top_info h2 {
  color: #D75B93; }
.top_info ul {
  margin-bottom: 20px;
  border-top: 1px dotted #999; }
  .top_info ul li {
    display: inline-block;
    width: 100%;
    border-bottom: 1px dotted #999;
    position: relative; }
    .top_info ul li a {
      display: block;
      padding: 7px 5px 5px;
      color: #333;
      text-decoration: none; }
      .top_info ul li a:after {
        content: '';
        display: block;
        width: 5px;
        height: 5px;
        border-top: 2px solid #3555aa;
        border-right: 2px solid #3555aa;
        transform: rotate(45deg);
        position: absolute;
        top: 15px;
        right: 8px; }
      .top_info ul li a .data {
        display: inline-block;
        padding: 4px 5px 2px;
        font-size: 0.8em;
        border-radius: 3px;
        background: #FFF;
        position: absolute;
        top: 5px;
        left: 190px; }
      .top_info ul li a .full {
        display: inline-block;
        padding: 4px 5px 2px;
        color: #FFF;
        font-size: 0.8em;
        border-radius: 3px;
        background: #F00;
        position: absolute;
        top: 5px;
        left: 190px; }

.contents_link {
  width: 100%;
  margin-bottom: 50px;
  position: relative;
  overflow: hidden; }
  .contents_link h2 {
    margin-bottom: 0 !important; }
  .contents_link dt {
    float: left; }
  .contents_link dd {
    float: right;
    width: 350px; }
  .contents_link .icon {
    position: absolute;
    top: 35px;
    left: -5px; }
  .contents_link .blue {
    background: #395BB7 !important; }

.icon {
  display: inline-block;
  margin: 0 10px;
  padding: 3px 5px;
  color: #FFF;
  font-size: 0.7em;
  background: #FB7BAE;
  border-radius: 5px;
  position: relative;
  top: -2px; }

.data-table {
  width: 100%;
  margin-bottom: 10px;
  border-top: 1px dotted #999; }
  .data-table th,
  .data-table td {
    padding: 5px;
    font-size: 14px;
    border-bottom: 1px dotted #999; }
  .data-table th {
    width: 60px;
    vertical-align: top; }

@media screen and (max-width: 640px) {
  .float_list li {
    float: none;
    width: 100%;
    margin-right: 0; }
    .float_list li .contents_link {
      min-height: inherit; }
      .float_list li .contents_link table {
        display: none; }
      .float_list li .contents_link .btn_link {
        position: relative; }

  .top_info ul li {
    display: block;
    width: 100%; }

  .contents_link {
    margin-bottom: 30px;
    overflow: visible; }
    .contents_link dt {
      width: 100%; }
      .contents_link dt img {
        width: 100%;
        margin: 0 auto 5px; }
    .contents_link dd {
      float: none;
      width: 100%; }

  .icon {
    margin: 0 5px;
    padding: 1px 5px 1px 5px;
    font-size: 0.7em; }

  .contents_link .icon {
    font-size: 0.8em;
    position: absolute;
    top: 35px;
    left: 0; } }
/*////////////////////////////////////////////////////////

news

////////////////////////////////////////////////////////*/
#news_box h1 {
  font-size: 1.4rem; }
#news_box ul {
  margin-bottom: 10px; }
  #news_box ul li {
    position: relative; }
    #news_box ul li a,
    #news_box ul li i {
      display: block;
      padding: 8px 5px 8px 120px;
      color: #666;
      font-size: 1.1em;
      font-style: normal;
      text-decoration: none;
      border-top: 1px dotted #999; }
    #news_box ul li a {
      color: #666;
      text-decoration: underline; }
    #news_box ul li span.date {
      display: inline-block;
      font-size: 0.8em;
      position: absolute;
      top: 12px;
      left: 5px; }
    #news_box ul li div {
      margin-top: 3px;
      padding: 5px 5px 5px 0;
      font-size: 0.8em; }
    #news_box ul li.link {
      text-align: right;
      border: none; }
      #news_box ul li.link a {
        display: inline-block; }
    #news_box ul li img {
      position: absolute;
      top: 47px;
      left: 5px; }
    #news_box ul li table {
      margin-top: 8px; }
      #news_box ul li table td {
        vertical-align: top; }

.post-date {
  color: #666;
  font-size: 0.8em; }

#news_school {
  border: none; }
  #news_school li {
    display: inline-block;
    font-size: 0.8em;
    border: none; }
    #news_school li a {
      padding: 5px !important;
      border: 1px solid #999 !important;
      background: #D9DDEE; }

#news_detail p {
  margin-bottom: 20px;
  position: relative;
  overflow: hidden; }
#news_detail .float_img {
  float: left;
  width: 200px;
  margin: 0 10px 0 0; }

@media screen and (max-width: 640px) {
  #news_box ul li {
    font-size: 0.9rem; }
    #news_box ul li a, #news_box ul li i {
      padding: 8px 5px; }
    #news_box ul li span.date {
      display: block;
      width: inherit;
      color: #666;
      font-size: 0.8em;
      position: relative;
      top: 0;
      left: 0; }
    #news_box ul li div {
      padding: 0;
      font-size: 0.8rem;
      position: relative;
      overflow: hidden; }
    #news_box ul li img {
      float: right;
      margin-left: 5px;
      position: relative;
      top: 0;
      left: 0; }

  #news_school li {
    width: 49%;
    margin-bottom: 3px;
    font-size: 0.7rem !important; }
    #news_school li a {
      padding: 8px 5px !important;
      border: 1px solid #999 !important;
      background: #D9DDEE; }

  #news_detail .float_img {
    width: 100px;
    margin: 0 5px 0 0; } }
/*////////////////////////////////////////////////////////

school

////////////////////////////////////////////////////////*/
.schedule_box {
  margin-bottom: 30px; }
  .schedule_box table {
    margin-bottom: 5px;
    border-top: 1px solid #999;
    border-left: 1px solid #999; }
    .schedule_box table td {
      width: 120px;
      padding: 5px;
      font-size: 0.9em;
      text-align: center;
      border-right: 1px solid #999;
      border-bottom: 1px solid #999; }

@media screen and (max-width: 640px) {
  .schedule_box table td {
    font-size: 0.7em; } }
.map {
  height: 0;
  margin-bottom: 20px;
  padding-bottom: 56.25%;
  padding-top: 30px;
  position: relative;
  overflow: hidden; }
  .map iframe,
  .map object,
  .map embed {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0; }

/*////////////////////////////////////////////////////////

photo

////////////////////////////////////////////////////////*/
#photo_list {
  position: relative;
  overflow: hidden; }
  #photo_list li {
    float: left;
    width: 150px;
    height: 150px;
    margin: 0 17px 17px 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    box-shadow: 2px 2px 2px #999; }
    #photo_list li:nth-child(4n) {
      margin-right: 0; }
    #photo_list li a {
      display: block;
      width: 150px;
      height: 150px;
      text-indent: -9999px;
      overflow: hidden; }

.banner_list img {
  width: 100%;
  max-width: 630px;
  margin-bottom: 10px; }

@media screen and (max-width: 640px) {
  #photo_list li {
    width: 42vw;
    height: 42vw;
    margin: 0 5px 10px 5px; }
    #photo_list li:nth-child(4n) {
      margin: 0 5px 10px 5px; }
    #photo_list li a {
      width: 100%;
      height: 100%; } }
/*////////////////////////////////////////////////////////

lecturer

////////////////////////////////////////////////////////*/
#lecturer_box {
  margin-bottom: 50px;
  text-align: center; }
  #lecturer_box iframe {
    width: 640px;
    height: 360px;
    margin-bottom: 50px; }

#lecturer_profile {
  width: 100%;
  margin-bottom: 50px;
  position: relative;
  overflow: hidden; }
  #lecturer_profile .name span {
    display: inline-block;
    margin-left: 15px;
    font-size: 1.5em; }
  #lecturer_profile dt {
    float: left;
    padding-left: 20px; }
  #lecturer_profile dd {
    float: right;
    width: 480px; }

#lecturer_photo {
  position: relative;
  overflow: hidden; }
  #lecturer_photo img {
    float: right;
    margin: 0 0 10px 10px; }

@media screen and (max-width: 640px) {
  #lecturer_box {
    margin-bottom: 50px;
    text-align: left; }
    #lecturer_box iframe {
      width: 100%;
      height: 230px;
      margin-bottom: 0; }

  #lecturer_profile dt {
    display: none; }
  #lecturer_profile dd {
    float: none;
    width: 100%; }

  #lecturer_photo img {
    float: none;
    display: block;
    margin: 0 auto 10px; } }
/*////////////////////////////////////////////////////////

contact

////////////////////////////////////////////////////////*/
#contact {
  display: table;
  width: 100%; }
  #contact input[type="text"],
  #contact input[type="email"],
  #contact textarea {
    width: 250px;
    margin-bottom: 3px;
    padding: 5px;
    font-size: 1em; }
  #contact select,
  #contact option {
    font-size: 1em; }
  #contact textarea {
    width: 350px;
    height: 200px;
    padding: 5px; }
  #contact dl {
    display: table-row; }
    #contact dl dt,
    #contact dl dd {
      display: table-cell;
      padding: 15px;
      vertical-align: top;
      border-bottom: 1px dotted #999;
      box-sizing: border-box; }
    #contact dl dt {
      width: 25%; }
    #contact dl dd {
      width: 73%; }

#btn-box {
  display: table;
  width: 200px;
  margin: 20px auto;
  padding: 20px;
  text-align: center; }
  #btn-box span {
    display: table-cell; }
  #btn-box input {
    padding: 10px 30px;
    color: #FFF;
    font-size: 16px;
    cursor: pointer;
    border: none;
    border-radius: 5px;
    box-shadow: 1px 1px 2px #666;
    background: -moz-linear-gradient(top, #395BB7, #294282);
    background: -webkit-gradient(linear, left top, left bottom, from(#395BB7), to(#294282));
    background: -ms-linear-gradient(top, #395BB7, #294282);
    background: linear-gradient(to bottom, #395BB7, #294282); }

#btn_back {
  margin-right: 15px;
  color: #333 !important;
  background: -moz-linear-gradient(top, #EEE, #CCC) !important;
  background: -webkit-gradient(linear, left top, left bottom, from(#EEE), to(#CCC)) !important;
  background: -ms-linear-gradient(top, #EEE, #CCC) !important;
  background: linear-gradient(to bottom, #EEE, #CCC) !important; }

#error {
  padding: 10px;
  color: #F00;
  border: 1px dotted #F00; }

@media screen and (max-width: 640px) {
  #contact {
    display: block;
    width: 100%; }
    #contact input,
    #contact textarea {
      font-size: 16px; }
    #contact textarea {
      width: 90%;
      height: 100px; }
    #contact dl {
      display: block; }
      #contact dl dt,
      #contact dl dd {
        display: block;
        padding: 0px;
        box-sizing: border-box; }
      #contact dl dt {
        width: 100%;
        font-weight: bold;
        border-bottom: none; }
      #contact dl dd {
        width: 100%;
        margin-bottom: 10px;
        padding-bottom: 10px; }

  .contact_page #nav_contact {
    display: none; } }
/*////////////////////////////////////////////////////////

privacy

////////////////////////////////////////////////////////*/
#privacy_box section {
  margin-bottom: 25px; }

/*////////////////////////////////////////////////////////

form

////////////////////////////////////////////////////////*/
.btn_link {
  margin-bottom: 0;
  text-align: right; }
  .btn_link a {
    display: inline-block;
    width: 142px;
    padding: 4px 0;
    color: #FFF;
    font-size: 0.9em;
    letter-spacing: 2px;
    text-align: center;
    text-decoration: none;
    background: -moz-linear-gradient(top, #395BB7, #294282);
    background: -webkit-gradient(linear, left top, left bottom, from(#395BB7), to(#294282));
    background: -ms-linear-gradient(top, #395BB7, #294282);
    background: linear-gradient(to bottom, #395BB7, #294282); }

/*////////////////////////////////////////////////////////

navigation layout

////////////////////////////////////////////////////////*/
/* contact
------------------------------------------------------- */
nav dl {
  margin-bottom: 15px;
  position: relative;
  overflow: hidden; }
  nav dl dt {
    float: left;
    width: 70px; }
  nav dl dd {
    float: right;
    width: 145px; }

@media screen and (max-width: 640px) {
  nav dl dt {
    width: 30%; }

  nav dl dd {
    width: 70%; } }
/* sp
------------------------------------------------------- */
#sp_box .qr {
  float: right;
  margin: 0 0 10px 10px; }

@media screen and (max-width: 640px) {
  #sp_box {
    display: none; } }
/* button
------------------------------------------------------- */
.nav_link {
  margin-bottom: 0;
  text-align: center; }
  .nav_link a {
    display: inline-block;
    padding: 4px 10px;
    color: #333;
    text-decoration: none;
    border: 1px solid #999;
    border-radius: 3px;
    background: -moz-linear-gradient(top, #FFF, #CCC);
    background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#CCC));
    background: -ms-linear-gradient(top, #FFF, #CCC);
    background: linear-gradient(to bottom, #FFF, #CCC); }

.list-link {
  margin-bottom: 40px;
  border-top: 1px dotted #999; }
  .list-link li {
    border-bottom: 1px dotted #999; }
    .list-link li a {
      display: block;
      padding: 8px 0;
      text-decoration: none; }