@charset "utf-8";

@import url("fontawesome-4.5.0.min.css");

div#content {
    background: #f0efe4;
}

body {
}
.col-lg-12.bg_orange.r_topspeace_50 {
    display:  table;
}
div#footer {background: #dadada;}

.menu li a {
    font-weight:  bold;
    color: #424242;
}

.btn-2 {
  border-top: 1px double;
  border-bottom: 1px double;
  padding: 10px;
}
/*base
---------------------------------------------------------------------------*/

div#logo h1 a {color: #000;font-size: 22px;text-decoration: none;}

div#logo h1 a:hover {color: #009688;}

div#logo p a {color: #000;font-size: 22px;}

div#logo p a:hover {color: #a52a2a;}

ul.menu a:hover {color: #009688;}

ul.menu {margin: 0;text-align: center;/* border: 5px solid #a4e8f5; */background: linear-gradient(#fff,#dadada);padding: 20px 0;}

ul.menu li:after {/* content: "■"; */margin-left: 2%;color: #a4e8f5;}

ul.menu li:last-child:after {content: none;}

a {text-decoration: none;color: #E64D9D;}

a:hover {color: #009688;}

#footer a:hover {color: #009688;}

h1 {margin: 0;font-size: 22px;}

h2 {margin: 10px 0;}

p.h1 {margin: 0;}

ul {padding: 0;}

button {margin: 2%;padding: 2%;border-radius: 15px;background: linear-gradient(#fff,#b5b5b5);border: none;}

ul.menu li {display: inline;margin: 0 10px;}

li {line-height: 20px;list-style: none;}

.article {width: 98%;margin: 0 auto;display: table;}

a.font-s {font-size: 14px !important;}

section {display: table;padding: 0 1%;margin: 1% 0;}

img {width: 100%;height: auto;}
.img_border {border-right: #c3dad8 10px solid;}

.l_img {width: 40%;height: auto;float: left;margin: 10px 10px 10px 0;}
.r_img {width: 40%;height: auto;float: right;margin-left: 10px;}

.col_2 {width: 48%;float: left;margin: 1%;}
.col_3 {float: left;width: 31%;margin: 0 1%;}

.font-s {font-size: 14px;}
.font-xs {font-size: 11px;}

.clear {clear: both;}
.speace {margin: 1% 0;}
.heddin {display: none;}
.center {text-align: center;}

.boder_dashed {border-bottom: 2px dashed #fff;}

.card {border: 10px solid #807f7c;border-radius: 10px;}

.circle {border-radius: 50%;border: 5px solid #fff;}

.board {background: #b5b5b5;margin: 1%;}
.board h2 {background: #888888;margin: 0;color: #fff;padding: 0 2%;}
.board p {padding: 2%;width: 96%;}
.board button {margin-right: 20px;margin-bottom: 20px;}

.ribbon {position: relative;color: #ffffff;background: #ffa500;font-size: 12pt;line-height: 1;margin: 20px -10px 20px -10px;padding: 10px 5px 10px 20px;box-shadow:1px 3px 7px 0px  #666666;border-top:3px solid #127dcd;}
.ribbon:after, ribbon:before {content: "";position: absolute;top: 100%;height: 0;width: 0;border: 5px solid transparent;border-top: 5px solid #456346;}
.ribbon:after {left: 0;border-right: 5px solid #456346;}
.ribbon:before {right: 0;border-left: 5px solid #333;}

.balloon {position: relative;color: #ffffff;background: #807f7c;/* font-size: 17pt ; */border: 1px solid #888888;/* margin: 10px 10px 21px 10px; */padding: 10px 5px 10px 10px;border-radius: 3px;}
.balloon:after, .balloon:before {content: "";position: absolute;top: 100%;height: 0;width: 0;}
.balloon:after {left: 40px;border: 10px solid transparent;border-top: 10px solid #807f7c;}
.balloon:before {left: 39px;border: 11px solid transparent;border-top: 11px solid #807f7c;}

.menuRibbon {margin:0 0 10px 0;padding:2px 8px;background:#88AAA9;color:#EBF7FA;line-height:140%;font-weight:bold;}
.menuRibbonLight {margin:0 0 10px 0;padding:2px 8px;background:#D12B36;color:#017589;line-height:140%;font-weight:bold;}
.menuTab {margin:0 0 10px 0;padding:2px 8px;border-width:0 0 0 5px;border-color: #D12B36;border-style:solid;background:#88AAA9;color:#EBF7FA;line-height:140%;font-weight:bold;}
.menuTabLight {margin:0 0 10px 0;padding:2px 8px;border-width:0 0 0 5px;border-color:#88AAA9;border-style:solid;background:#D12B36;color:#017589;line-height:140%;font-weight:bold;}
.menuTabDouble {margin:0 0 10px 0;padding:2px 8px;border-width:0 5px;border-color: #D12B36;border-style:solid;background:#88AAA9;color:#EBF7FA;line-height:140%;font-weight:bold;text-align:center;}
.menuTabDoubleLight {margin:0 0 10px 0;padding:2px 8px;border-width:0 5px;border-color:#88AAA9;border-style:solid;background:#D12B36;color:#017589;line-height:140%;font-weight:bold;text-align:center;}
.menuLine {margin:0 0 10px 0;padding:2px 8px;border-width:0 0 5px 0;border-color: #D12B36;border-style:solid;background:#88AAA9;color:#EBF7FA;line-height:140%;font-weight:bold;}
.menuLineLight {margin:0 0 10px 0;padding:2px 8px;border-width:0 0 5px 0;border-color:#88AAA9;border-style:solid;background:#D12B36;color: #fff;line-height:140%;font-weight:bold;}
.menuLineDouble {margin:0 0 10px 0;padding:2px 8px;border-width:5px 0;border-color: #D12B36;border-style:solid;background:#88AAA9;color:#EBF7FA;line-height:140%;font-weight:bold;text-align:center;}
.menuLineDoubleLightW {margin:0 0 10px 0;padding:2px 8px;border-width:5px 0;border-color: #9E9E9E;border-style:solid;background:#fff;color: #E64D9D;line-height:140%;font-weight:bold;text-align:center;}
.menuLineDoubleLight {margin:0 0 10px 0;padding:2px 8px;border-width:5px 0;border-color: #808080;border-style:solid;background: #fff;color: #D12B36;line-height:140%;font-weight:bold;text-align:center;}
.menuLineLightW {margin:0 0 10px 0;padding:2px 8px;border-width:0 0 5px 0 ;border-color:#88AAA9;border-style:solid;background:#fff;color:#017589;line-height:140%;font-weight:bold;}

.lbor{/*全体枠*/
  width: 400px;/*全体の幅*/
  border-left: solid 4px #747474;/*枠色*/
  border-bottom: solid 1px #747474;
  background: #464646;
  }
.lbor h2{/*タイトル部分*/
  width: 100%;
  font-size: 10pt;/*文字サイズ*/
  font-family: Impact,Arial,Verdana,sans-serif;
  letter-spacing: 0.4em;
  color: #FFFFFF;/*文字色*/
  background-color: #747474;/*背景色*/
  padding: 1px 1em 1px 0.7em;
  border-left: solid 3px #DADADD;
  filter: alpha(opacity=100,finishopacity=10,style=1);
  }
.lbor p{/*内容部分*/
  /*文字サイズ*/
  /*文字色*/
  padding: 0.7em;
  border-top: solid 1px #747474;/*枠色*/
  border-right: solid 1px #F5F5F5;
  border-left: solid 3px #DADADD;
  }

.lbor{/*全体枠*/
  width: 400px;/*全体の幅*/
  border-left: solid 4px #747474;/*枠色*/
  border-bottom: solid 1px #747474;
  background: #464646;
  }
.lbor h2{/*タイトル部分*/
  width: 100%;
  font-size: 10pt;/*文字サイズ*/
  font-family: Impact,Arial,Verdana,sans-serif;
  letter-spacing: 0.4em;
  color: #FFFFFF;/*文字色*/
  background-color: #747474;/*背景色*/
  padding: 1px 1em 1px 0.7em;
  border-left: solid 3px #DADADD;
  filter: alpha(opacity=100,finishopacity=10,style=1);
  }
.lbor p{/*内容部分*/
  /*文字サイズ*/
  /*文字色*/
  padding: 0.7em;
  border-top: solid 1px #747474;/*枠色*/
  border-right: solid 1px #F5F5F5;
  border-left: solid 3px #DADADD;
  }

.dotto {
  position:relative;
  padding:5px;
  font:bold 24px/1.6 Arial, Helvetica, sans-serif;
  text-align:center;
  color:#655;
  border-top:1px dashed #aaa;
  border-bottom:1px dashed #aaa;
  background:#eee;
  text-shadow:1px 1px 0 rgba(255,255,255,1);
  box-shadow: 0 5px 4px -4px rgba(0,0,0,0.3) inset;
}

.tape{
  position:relative;
  margin:0 -1px;
  font:bold 30px/1.6 Arial, Helvetica, sans-serif;
  text-align:center;
  color:#333;
  background:#f0e800;
  -webkit-transform: rotate(-3deg) skew(-3deg);
  -moz-transform: rotate(-3deg) skew(-3deg);
  -o-transform: rotate(-3deg) skew(-3deg);
  -ms-transform: rotate(-3deg) skew(-3deg);
  transform: rotate(-3deg) skew(-3deg);
  text-shadow:1px 1px 0 rgba(255,255,255,1);
  box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2),
        30px 0 0 0 #f0e800,
        -30px 0 0 0 #f0e800;
}

.label {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: #494949;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #E64D9D;/*左線*/
}


.macis {background: #fff;border-radius: 5px;padding: 0;overflow: hidden;color: #6b6b6b;}
.macis h2 {background: #807f7c;width: 100%;margin: 0;color: #777;border-bottom: 1px solid #ababab;}
.macis button a {color: #777;}

#footer a, #footer p,span {
    color: #8a8a8a;
    /* font-weight:  bold; */
}

.bg_gray {
    background-color: #a9a9a9;
}

.bg_orange {
    background: linear-gradient(-45deg,#FF9800,#E64D9D);
}

.bg_orange h2,.bg_orange h1 {
    color:  #fff;
    font-size: 1.5em;
    text-align:  center;
    margin-top: 30%;
}


div#mgn-0 {
    padding:  0;
}

.text_content {
    background: linear-gradient(#dadada,#fff);
}

h3 {font-size: 14px; font-weight: bold;}
/*
humberger
---------------------------------------------------------------------------*/
#nav-drawer {display: none;}
header {width: 100%;}

@media screen and (max-width : 1024px) {/*mobileのとき表示*/
header {padding: 10px 3%;background: #737373;position: fixed;z-index: 100;width: 100%;top: 0;left: 0;box-shadow: 0px -4px 20px -3px #000000;}
#nav-drawer {display: block;width: 5%;}
#nav-drawer {position: relative;margin-top: 10px;}
.nav-unshown {display:none;}
#nav-open {display: inline-block;width: 30px;height: 22px;vertical-align: middle;}
#nav-open span, #nav-open span:before, #nav-open span:after {position: absolute;height: 3px;width: 25px;border-radius: 3px;background: #555;display: block;content: '';cursor: pointer;}
#nav-open span:before {bottom: -8px;}
#nav-open span:after {bottom: -16px;}
#nav-close {display: none;position: fixed;z-index: 99;top: 0;left: 0;width: 100%;height: 100%;background: black;opacity: 0;transition: .3s ease-in-out;}
#nav-content {overflow: auto;position: fixed;top: 0;left: 0;z-index: 9999;width: 90%;max-width: 330px;height: 100%;background: #fff;transition: .3s ease-in-out;-webkit-transform: translateX(-105%);transform: translateX(-105%);text-align: center;}
#nav-input:checked ~ #nav-close {display: block;/opacity: .5;}
#nav-input:checked ~ #nav-content {-webkit-transform: translateX(0%);transform: translateX(0%);box-shadow: 6px 0 25px rgba(0,0,0,.15);background: #fff;}
.nav-menu img {float: left;margin-left: 5%;width: 40%;}
div#nav-content h2 {/* border: 3px double #03A9F4; */font-size: 13px;color:  #fff;}
}

/*
#back-to-top
---------------------------------------------------------------------------*/
#back-to-top {position: fixed;right: 20px;bottom: 5px;background-color: rgb(218, 218, 218);display: block;padding: 1%;border-radius: 20px;z-index: 100;}
#back-to-top a {font-weight: bold;display: inline-block;}

/*scrollaction
---------------------------------------------------------------------------*/
.fade-in {transition: opacity 0.4s;-moz-transition: opacity 0.4s;-webkit-transition: opacity 0.4s;-o-transition: opacity 0.4s;}
.fade-up {transition: opacity 0.7s;-moz-transition: opacity 0.7s;-webkit-transition: opacity 0.7s;-o-transition: opacity 0.7s;transition: transform 0.7s;-moz-transition: transform 0.7s;-webkit-transition: transform 0.7s;-o-transition: transform 0.7s;}

/*speace
---------------------------------------------------------------------------*/
.btmspeace_10 {margin-bottom: 10px;}
.btmspeace_20 {margin-bottom: 20px;}
.btmspeace_30 {margin-bottom: 30px;}
.btmspeace_40 {margin-bottom: 40px;}
.btmspeace_50 {margin-bottom: 50px;}

.topspeace_10 {margin-top: 10px;}
.topspeace_20 {margin-top: 20px;}
.topspeace_30 {margin-top: 30px;}
.topspeace_40 {margin-top: 40px;}
.topspeace_50 {margin-top: 50px;}
.topspeace_100 {margin-top: 100px;}

/*responctive
---------------------------------------------------------------------------*/
@media screen and (max-width : 1024px) {

body {font-size: 13px;}

.r_btmspeace_50 {margin-bottom: 50px;}
.r_topspeace_50 {margin-top: 50px;}
.r_btmspeace_100 {margin-bottom: 100px;}
.r_topspeace_100 {margin-top: 100px;}

div#logo {float: right;
  width: 98%;
  text-align: center;
}
.box {display: block;float: none;width: 98%;margin: 0 1%;}
li {display: block;margin: 0 1%;}
#container {width: 98%;padding: 0px;}

div#menu {height: auto;width: 100%;}

div#menu li {display: block;margin: 0px;}

div#menu ul {padding-top: 0px;}

img {width: 100%;float: none;margin: 0;height: auto;box-shadow: none;}

img.imgl {
    width: 100%;
    height: 50%;
    float: none;
    margin-right: 0;
}

.l_img,.r_img {
    float: none;
    width: 100%;
    margin: 15px 0 0 0;
    padding: 0;
}

.margin_res {
    width: 96%;
    margin: 0 auto;
}

div#logo h1 a {font-size: 14px;}

div#logo p a {font-size: 14px;}

h2 {font-size: 14px;}

h1 {font-size: 14px;}

div#footer {width: 100%;margin-top: 20px;}

div#footerPan {width: 100%;height: auto;}

ul.menu {text-align: center;background: #888888;display: block;}

.r_heddin {display: none;}

.article {width: 100%;margin: 0;}

.col_2,.col_3 {width: 100%;float: left;margin: 10px 0;}

.board button {margin: 0 10px 10px 10px;}

.img_border {border-right: #c3dad8 5px solid;}

div#container {
    width: 98%;
}

div#wrapper {
    width: 100%;
    padding-top: 1%;
}


ul.menu {
    display: none;
}

.left {
    width: 100%;
    float: none;
}

div#right {
    width: 100%;
    float: none;
}

div#footer p {
    display: none;
}

body {
    width: 100%;
    margin: 0;
}

ul.menu {
    width: 100%;
    float: none;
    padding: 0;
    position: unset;
    left: 0;
    bottom: 0;
    margin: auto;
}

div#wrapper {
    width: 98%;
    padding: 0 1%;
    box-shadow: none;
}

.rigth {
    float: none;
    width: 100%;
}

h2.card {
    box-shadow: none;
    padding: 0;
    background: #807f7c;
}

.wrap {display: table;padding: 2%;}

.speace {margin: 10px 0;}

ul.menu li:after {
    content: none;
}

ul.menu li:last-child:after {
    content: none;
}

.mb_s {margin-bottom: 20px;}


.card {border: none;}

p.h1 {margin: 0px 0;}

ul.menu li {
    margin-top: 0%;
    background: #ffffbc;
}

.font-14 {
    font-size: 14px;
}

div#logo {
  width: 90%;
}

.dotto {
  font:bold 12pt/1.6 Arial, Helvetica, sans-serif;
}

.tape{
  font:bold 12pt/1.6 Arial, Helvetica, sans-serif;
}

.bg_orange h2,.bg_orange h1 {
    color:  #fff;
    font-size:  14px;
    margin-top: 5%;
}


}/*~Fin~*/