@charset "utf-8";
/* CSS Document */
/*.header_nav { border-bottom: solid 15px #00A0E9;}*/

.top:before{
  content:"";
  display:block;
  position:fixed;
  left:0;
  z-index:-1;
  width:100%;
  ;
/*  background:url("../images/slider01.jpg") center no-repeat;
  background-size:cover;*/
}


/*body {
 overflow-x: hidden;
}*/

body {
  box-sizing : border-box;
	padding:0;
}

.wrap {
	overflow: hidden;
}
/*header{
	position:fixed
}*/

ol, ul {
	list-style: none;
}

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, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, main {
	display: block;
}

h3 {
    font-size: 27px;
}

.headtop{
	margin:50px 0
}

.annai{padding:1em auto}
.annai h5 {
    font-size: 17px;
	font-weight: bold;
	color:#00A0E9;
}

.annai h5:hover{opacity: 0.5;}

body{box-sizing : border-box;
	font-family: 'Roboto Condensed', 'Noto Sans JP', sans-serif;
	
}

main{padding: 0}

/*main{padding:auto}*/
/**/
.sliderArea {box-sizing: border-box;max-width:100% }
.slider02　img {box-sizing: border-box;
    max-width: 100%;
    max-height: 100%;
   
    width: auto\9; /* ie8 */
    margin: 0 ;
}
.slider02 .slick-dots {
    bottom: 4%;
    z-index: +1;}
/*.slider02 div.img01 {
  background-image: url(../images/slider/001.png);
}
.slider02 div.img02 {
  background-image: url("../images/slider/002.png");
}
.slider02 div.img03 {
  background-image: url(../images/slider/003.png);
  
}*/
/*.slider02 a{
	height: auto;
	position: relative;
}
.slider02 a div{
	
	
	position: absolute;
	top: 0px;
	left: 0px;
	display: flex;
	flex-direction: column;
	justify-content: center; 
        align-items: center; 
}
.slide02 a div p{
	font-size: 5em;
	color: #fff;
}*/

/**/


.footer_menu { border-top: solid 3px #D8D8D8;}
.footer_menu2 {background-color: #00A0E9;}
/*.header_logo {border-bottom: solid 10px #00A0E9;}*/
.footer_menu2 a {color: #FFFFFF;}
.footer_menu2 li { list-style: none;
                   text-align: center;
                    padding-top:30px;
                    padding-bottom:30px;
                    width:100%}
.show-for-large-up { border-top: solid 20px #00A0E9;}



.fwrapper{
   width: 100%;
   
}

.footer01{width:100%;
          margin: auto;
         
          padding: 10px;/*これを書かないとフッターの下に余白ができてしまう*/}





/*.sample1 {
	width:			300px;
	height:			160px;
	overflow:		hidden;
	margin:			10px 8px 10px 16px;
	position:		relative;	/* 相対位置指定 */
/*}
/* .sample1 .caption {
	
	font-size:		130%;
	text-align:center;
	padding:2em;
	padding-top:1em;
	color:			#fff;
}
.sample1 .mask {
	width:			100%;
	height:			100%;
	position:		absolute;	/* 絶対位置指定 */
	/* top:			0;
	left:			0;
	opacity:		0;	/* マスクを表示しない */
	/* background-color:	rgba(0,0,0,0.4);	/* マスクは半透明 */
	/* -webkit-transition:	all 0.2s ease;
	transition:		all 0.2s ease;
}
.sample1:hover .mask {
	opacity:		1;	/* マスクを表示する */
/*}*/

.gyoum{padding-right: auto;padding-left: auto}
.gyoumu{padding: auto}

figure.snip1229 {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  overflow: hidden;
  margin: 10px;
  /*min-width: 220px;*/
  max-width: 100%;
  max-height: 100%;
  width: 100%;
font-color: #ffffff;
 background-color: #2c2c2c;
	margin:5px auto;
  
  text-align: center;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
figure.snip1229 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.45s ease;
  transition: all 0.45s ease;
}
figure.snip1229 img {
  max-width: 100%;
  position: relative;
  opacity: 0.9;
	padding: 0 auto;
}
figure.snip1229 figcaption {
  position: absolute;
  top: 9%;
  left: 7%;
  right: 7%;
  bottom: 80%;
  border: 1px solid white;
  border-width: 0 1px 1px;
  -webkit-transition-delay: 0.35s;
  transition-delay: 0.35s;
}
figure.snip1229 .heading {
  overflow: hidden;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
figure.snip1229 h3{
  display: table;
  margin: 0 auto;
  padding: 0 10px;
  position: relative;
  text-align: center;
  width: auto;
  text-transform: uppercase;
  font-weight: 400;
}
figure.snip1229 h3 span.01 {
  font-weight: 800;
}
figure.snip1229 h3:before,
figure.snip1229 h3:after {
  position: absolute;
  display: block;
  width: 1000%;
  height: 1px;
  content: '';
  background: white;
  top: 50%;
}
figure.snip1229 h3:before {
  left: -1000%;
}
figure.snip1229 h3:after {
  right: -1000%;
}
figure.snip1229 p {
	font-size: 17px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  position: absolute;
  width: 100%;
  padding: 0 20px;
  margin: 0;
  opacity: 0;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}
figure.snip1229 a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
}
figure.snip1229:hover img,
figure.snip1229.hover img {
  opacity: 0.15;
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
figure.snip1229:hover figcaption,
figure.snip1229.hover figcaption {
  top: 9%;
  bottom: 9%;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}
figure.snip1229:hover p,
figure.snip1229.hover p {
  opacity: 1;
  -webkit-transition-delay: 0.4s;
  transition-delay: 0.4s;
}


#list{text-align: center}
#list ul{display: inline-block;; text-align: center;}

#list ul li{width:33%;   
  padding: 0 20px;float: left; text-align:center;} 





.002{text-align: center}




.fff h3{font-color="#fff"}

.fff p{font-color="#fff"}



/* クリアフィックス */


#item-list ul:after {

  content: "";


  display: block;


}

 

/* 商品一覧のリストの設定 */

#item-list ul li { width: 50%;

  display:inline-block;

  float: left;

  height:3em;

  text-align:left;

}




.float_box{float: left;
}


.cssgrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  grid-auto-rows: 1fr;
  grid-gap: 0.8em;
 
  padding: 0.8em;
  margin: 0 0 2em;
}

.cssgrid > div {
 
  overflow: auto;
  min-width: 0;
  padding: 1em;
}


/*.footer {

bottom: 0;
width: 100%;
 Set the fixed height of the footer here 
height:150px;
background-color:#00A0E9;
text-align: center
}*/
.foot{max-width: 1280px;margin: 0 auto;}
.footer{padding:40px 50px;background-color:#00A0E9;color:#fff}
.footer__row{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:10px}
.footer__logo{margin-bottom:14px}
.footer__logo img{width:300px}
.footer__address{font-size:.9375rem;line-height:1.667;color:#fff}
.footer__address a{color:#fff;/*opacity: 0.5;*/
    text-decoration:none;}
.footer__privacy{font-size:.875rem}
.footer__copyright{display:block;font-size:.75rem;text-align:right}
.content__caption{padding:45px 0;padding-top:62px;color:#00A0E9;font-size:2.1875rem;font-weight:700;letter-spacing:.5em;line-height:1.371;text-align:center}

body > .container {
padding: 60px 15px 0;
}
.container .text-muted {
margin: 20px 0 0 0;
}
 
.footer > .container {

}

/*slick*/
.slick-slide {
  position: relative;
}
.slick-slide .caption {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 2;
  width: 100%/*calc(100% - 40px)*/;
  padding: 20px;
margin-bottom: 0;
  background: rgba(0, 0, 0, .6);
  color: #fff;
  font-size: 1em;
  opacity: 0;
  transition: .3s ease;
}
.slick-current .caption {
  opacity: 1;
  transition-delay: .5s;
}

.slider02 img{
	
}

/*@media(max-width: 768px){.headpc{display: none!important}}

@media (min-width: 768px){
	.full-screen slider{with:100%}
	.slick-slide .caption {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 2;
  width: 100%calc(100% - 40px);
  padding: 1em;
margin-bottom: 0;
  background: rgba(0, 0, 0, .6);
  color: #fff;
  font-size: 1em;
  opacity: 0;
  transition: .3s ease;
}
	

.slick-current .caption {
  opacity: 1;
  transition-delay: .5s;
}
	.slide-dots{padding-top: 10px;}
	
	.headsp{display: none!important}
}*/


/**/

/*header {z-index: 30000;
   padding: 30px 4% 10px;
   position: fixed;
   top: 0;
   width: 100%;
   background-color: transparent;
   display: flex;
   align-items: center;
}*/
/*h1 {
   margin: 0; padding: 0;
   font-size: 20px;
}
a {	
   text-decoration: none;
   color: #fff;
}
nav {
   margin: 0 0 0 auto;
}
ul {
   list-style: none;
   margin: 0 5em;
   display: flex;
}
li {
   margin: 0 2em 0 2em;
   font-size: 18px;
}
.main-visual {
   display: flex;
   justify-content: center;
   align-items: center;
   height: 100vh;
   background: url('main_visual.jpg') top center / cover no-repeat;
}
h2 {
   margin: 0;
   font-size: 30px;
   font-weight: normal;
   color: #fff;
}

.sp-nav {
   display: none;
}*/

/*@media screen and (max-width: 640px) {
   .pc-nav {
      display: none;
   }
   .sp-nav {
      z-index: 1;
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100vh;
      display: block;
      width: 100%;
      background: rgba(0, 0, 0, .8);
      opacity: 0;
      transform: translateY(-100%);
      transition: all .2s ease-in-out;
   }
   #hamburger {
      position: relative;
      display: block;
      width: 30px;
      height: 25px;
      margin: 0 0 0 auto;
   }
   #hamburger span {
      position: absolute;
      top: 50%;
      left: 0;
      display: block;
      width: 100%;
      height: 2px;
      background-color: #fff;
      transform: translateY(-50%);
   }
   #hamburger::before {
      content: '';
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 2px;
      background-color: #fff;
   }
   #hamburger::after {
      content: '';
      display: block;
      position: absolute;
      bottom: 0;
      left: 0;
      width: 70%;
      height: 2px;
      background-color: #fff;
   }
   
   .sp-nav ul {
      padding: 0;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      height: 100%;
   }
   .sp-nav li {
      margin: 0;
      padding: 0;
   }
   .sp-nav li span {
      font-size: 15px;
      color: #fff;
   }
   .sp-nav li a, .sp-nav li span {
      display: block;
      padding: 20px 0;
   }
   
   .sp-nav .close {
      position: relative;
      padding-left: 20px;
   }
   .sp-nav .close::before {
      content: '';
      position: absolute;
      top: 50%;
      left: 0;
      display: block;
      width: 16px;
      height: 1px;
      background: #fff;
      transform: rotate( 45deg );
   }
   .sp-nav .close::after {
      content: '';
      position: absolute;
      top: 50%;
      left: 0;
      display: block;
      width: 16px;
      height: 1px;
      background: #fff;
      transform: rotate( -45deg );
   }
   .toggle {
      transform: translateY( 0 );
      opacity: 1;
   }
   .main-visual {
      padding: 0 4%;
   }
   h2 {
      line-height: 1.6;
      text-align: center;
   }

}*/




/*



.slide-arrow{
  position: absolute;
  top: 50%;
  margin-top: -15px;
}
.prev-arrow{
  left: -40px;
  width: 0;
  height: 0;
  border-left: 0 solid transparent;
  border-right: 15px solid #113463;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
}
.next-arrow{
  right: -40px;
  width: 0;
  height: 0;
  border-right: 0 solid transparent;
  border-left: 15px solid #113463;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
}
*/

.roboto {
  font-family: 'Roboto', sans-serif; }
@media(min-width: 769px){.sp-header{display: none!important}}

#mainHeader {
  background-color: #fff;
  transition: all .3s ease 0s;
  -moz-transition: all .3s ease 0s;
  -webkit-transition: all .3s ease 0s;
  padding: 16px 20px 10px;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999; }
  #mainHeader:hover {
    text-decoration: none; }
  #mainHeader .mainHeader--inner {
    max-width: 1280px;
    margin: 0 auto;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-between;
    align-items: center; }
  #mainHeader .logo {
    width: 250px; }
    #mainHeader .logo .m_logo {
      transition: all .3s ease 0s;
      -moz-transition: all .3s ease 0s;
      -webkit-transition: all .3s ease 0s; }
      #mainHeader .logo .m_logo:hover {
        text-decoration: none; }
    #mainHeader .logo .w_logo {
      opacity: 0;
      position: absolute;
      top: 0;
      transition: all .3s ease 0s;
      -moz-transition: all .3s ease 0s;
      -webkit-transition: all .3s ease 0s;
      width: 100%;
      left: 0; }
      #mainHeader .logo .w_logo:hover {
        text-decoration: none; }
    #mainHeader .logo a {
      display: block;
      transition: all .3s ease 0s;
      -moz-transition: all .3s ease 0s;
      -webkit-transition: all .3s ease 0s;
      position: relative; }
      #mainHeader .logo a:hover {
        text-decoration: none; }
      #mainHeader .logo a:hover {
        opacity: .7;
        text-decoration: none; }
  #mainHeader.logo_visible .m_logo {
    opacity: 1 !important; }
  #mainHeader.logo_visible .w_logo {
    opacity: 0 !important; }
  #mainHeader #gNav {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 800px;
    width: calc(100% - 200px);
    margin-top: -12px; }
    @media (max-width: 1024px) {
      #mainHeader #gNav {
        max-width: 740px; } }
  #mainHeader .gNav--nav {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-between;
    max-width: 800px;
    align-items: center;
    font-weight: bold; }
    #mainHeader .gNav--nav > li {
      position: relative;
      padding: 0 1em;
	
}
/*　スマホ-PCサイズ間でメニュー項目の改行防止　*/
@media screen and (min-width:866px) and ( max-width:1024px) {
    #mainHeader .logo {
    width: 150px; }
    #mainHeader .gNav--nav > li {
    padding: 0 0.5em;
    }
}
@media screen and (min-width:784px) and ( max-width:865px) {
#mainHeader .logo {
    width: 150px; }
    #mainHeader .gNav--nav > li {
    padding: 0 0.4em;
    font-size: 12px;
    }
#mainHeader .gNav--nav .childList > ul > li > a {
    font-size: 13px;}    
    
}

/*.gNav--nav a{color: #000}*/
      #mainHeader .gNav--nav > li:hover > a:after {
        transform: translate(0%);
        -webkit-transform: translate(0%); }
      #mainHeader .gNav--nav > li:hover .childList {
        transform: translateY(100%) scaleY(1);
        -webkit-transform: translateY(100%) scaleY(1); }
    #mainHeader .gNav--nav .childList {
      position: absolute;
      transform-origin: top center;
      -moz-transform-origin: top center;
      -webkit-transform-origin: top center;
      transform: translateY(100%) scaleY(0);
      -webkit-transform: translateY(100%) scaleY(0);
      /*left: 1em;*/
      width: calc(100% - 2em);
      bottom: 0;
      background-color: rgba(255, 255, 255, 0.8);
      transition: all .3s ease 0s;
      -moz-transition: all .3s ease 0s;
      -webkit-transition: all .3s ease 0s; }
      @media (min-width: 801px) {
        #mainHeader .gNav--nav .childList {
          display: block !important; } }
      #mainHeader .gNav--nav .childList:hover {
        text-decoration: none; }
      #mainHeader .gNav--nav .childList > ul > li {
        border-bottom: 1px dashed #ffffff;  background-color: rgba(255,255,255,0)
/*background-color: none*/}
        /*#mainHeader .gNav--nav .childList > ul > li:last-child {
          border-bottom-width: 0; }*/
        #mainHeader .gNav--nav .childList > ul > li > a {
          display: block;
          font-size: 16px;
          line-height: 1.2;
          padding: 0.6em /*1em*/;
          text-align: center;
          transition: all .3s ease 0s;
          -moz-transition: all .3s ease 0s;
          -webkit-transition: all .3s ease 0s; }
          #mainHeader .gNav--nav .childList > ul > li > a:hover {
            text-decoration: none; }
          #mainHeader .gNav--nav .childList > ul > li > a:hover {
            background-color:rgba(0,160,233,0.5) }
      #mainHeader .gNav--nav .childList.works {
        width: 300px;
		 
}
        #mainHeader .gNav--nav .childList.works > ul {
          display: -webkit-flex;
          display: -moz-flex;
          display: -ms-flex;
          display: -o-flex;
          display: flex;
          flex-wrap: wrap;
          width: 100%; }
          #mainHeader .gNav--nav .childList.works > ul > li {
            width: calc(100% / 2); }
            #mainHeader .gNav--nav .childList.works > ul > li > a {
              text-align: left; }
            /*#mainHeader .gNav--nav .childList.works > ul > li:last-child {
              width: 100%; }*/
    #mainHeader .gNav--nav > li > a {
      font-size: 18px;
      display: block;
      line-height: 1.2;
      padding: 0.2em 0 5px;
      position: relative;
      overflow: hidden;
      transition: all .3s ease 0s;
      -moz-transition: all .3s ease 0s;
      -webkit-transition: all .3s ease 0s; }
      #mainHeader .gNav--nav > li > a:hover {
        text-decoration: none; }
      @media (max-width: 1024px) {
        #mainHeader .gNav--nav > li > a {
          font-size: 18px; } }
      #mainHeader .gNav--nav > li > a:after {
        transition: all .3s ease 0s;
        -moz-transition: all .3s ease 0s;
        -webkit-transition: all .3s ease 0s;
        content: '';
        display: block;
        height: 3px;
        position: absolute;
        bottom: 0;
        width: 100%;
        background-color: #0071bc;
        left: 0;
        transform: translate(-110%);
        -webkit-transform: translate(-110%); }
        #mainHeader .gNav--nav > li > a:after:hover {
          text-decoration: none; }
  #mainHeader .snsNav {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding-right: 12px; }
    #mainHeader .snsNav > a {
      font-size: 32px;
      transition: all .3s ease 0s;
      -moz-transition: all .3s ease 0s;
      -webkit-transition: all .3s ease 0s;
      margin-left: 12px; }
      @media (max-width: 1024px) {
        #mainHeader .snsNav > a {
          font-size: 26px; } }
      #mainHeader .snsNav > a:hover {
        text-decoration: none; }
      #mainHeader .snsNav > a:hover {
        opacity: .7;
        text-decoration: none; }
      #mainHeader .snsNav > a.fb {
        color: #0071bc; }
  #mainHeader.top {
    background-color: transparent; }
    #mainHeader.top .logo .m_logo {
      opacity: 0; }
    #mainHeader.top .logo .w_logo {
      opacity: 1; }
    @media (min-width: 801px) {
	#spBT {
display: none;	}
      #mainHeader.top .gNav--nav .childList {
        background-color: rgba(255, 255, 255, 0.8);
        background-color: transparent; }
        #mainHeader.top .gNav--nav .childList > ul > li {
          border-bottom-color: #000; }
          #mainHeader.top .gNav--nav .childList > ul > li > a {
            color: #fff; }
      #mainHeader.top .gNav--nav > li > a {
        color: #fff; } }
    #mainHeader.top .snsNav > a {
      color: #fff !important; }
    #mainHeader.top #spBT span {
      background-color: #fff; }

/*#spBT {
display: none;}*/
 /* width: 40px;
  height: 40px;
  cursor: pointer;
  padding-top: 12px;
  position: relative;
  z-index: 10;
  z-index: 99999; }
  #spBT span {
    background-color: #00a099;
    display: block;
    margin-top: 5px;
    margin-left: auto;
    margin-right: auto;
    width: 24px;
    height: 2px;
    position: relative;
    top: 0;
    transition: all .3s ease 0s;
    -moz-transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s; }
    #spBT span:hover {
      text-decoration: none; }
    #spBT span:first-child {
      margin-top: 0; }
  #spBT.active span:nth-child(2) {
    opacity: 0; }
  #spBT.active span:first-child {
    top: 7px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg); }
  #spBT.active span:nth-child(3) {
    top: -7px;
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg); */


@media only screen and (max-width: 800px) {
  body {
    font-size: 1.08rem; }

  .o_sp {
    display: block !important; }

  .o_pc {
    display: none !important; }

  .sp_textLeft {
    text-align: left; }

  #mainHeader {
    padding: 0 0 0 10px; }
    #mainHeader #gNav {
      display: block;
      position: fixed;
      top: 56px;
      left: 0;
      width: 100%;
      background-color: rgba(255, 255, 255, 0.95);
      margin-top: 0;
      transition: all .3s ease 0s;
      -moz-transition: all .3s ease 0s;
      -webkit-transition: all .3s ease 0s;
      transform-origin: top center;
      -moz-transform-origin: top center;
      -webkit-transform-origin: top center;
      transform: scaleY(0);
      -webkit-transform: scaleY(0);
      max-width: 100%;
      overflow: auto;
      max-height: calc(100% - 56px);
      -webkit-overflow-scrolling: touch; }
      #mainHeader #gNav:hover {
        text-decoration: none; }
      #mainHeader #gNav * {
        max-width: 100% !important; }
      #mainHeader #gNav.active {
        transform: scaleY(1);
        -webkit-transform: scaleY(1); }
      #mainHeader #gNav .snsNav {
        padding: 10px;
        justify-content: center; }
        #mainHeader #gNav .snsNav > a {
          margin: 0 6px;
          color: #333 !important; }
          #mainHeader #gNav .snsNav > a.fb {
            color: #0071bc !important; }
    #mainHeader .gNav--nav {
      display: block; }
      #mainHeader .gNav--nav > li {
        padding: 0;
        border-bottom: 1px solid #fff; }
        #mainHeader .gNav--nav > li:first-child {
          border-top: 1px solid #fff; }
        #mainHeader .gNav--nav > li > a {
          padding: 0.8em;
          text-align: center;
          color: #333 !important; }
          #mainHeader .gNav--nav > li > a.hasChild {
            position: relative; }
            #mainHeader .gNav--nav > li > a.hasChild:before {
              content: '';
              display: block;
              width: 9px;
              height: 9px;
              position: absolute;
              right: 10px;
              top: 50%;
              margin-top: -9px;
              border: 1px solid transparent;
              border-bottom-color: #333;
              border-right-color: #333;
              transform: rotate(45deg);
              -webkit-transform: rotate(45deg);
              transition: all .3s ease 0s;
              -moz-transition: all .3s ease 0s;
              -webkit-transition: all .3s ease 0s; }
              #mainHeader .gNav--nav > li > a.hasChild:before:hover {
                text-decoration: none; }
            #mainHeader .gNav--nav > li > a.hasChild.active:before {
              transform: rotate(-135deg);
              -webkit-transform: rotate(-135deg);
              margin-top: -4px; }
        #mainHeader .gNav--nav > li:hover .childList {
          transform: none;
          -webkit-transform: none; }
      #mainHeader .gNav--nav .childList {
        display: none;
        transform: none;
        -webkit-transform: none;
        position: static;
        width: 100% !important;
        border-top: 1px dashed #ffffff;
/*			body {
  box-sizing : border-box;
};*/
        transition: none; }
        #mainHeader .gNav--nav .childList > ul {
          display: block !important; }
          #mainHeader .gNav--nav .childList > ul > li {
            width: 100% !important; }
            #mainHeader .gNav--nav .childList > ul > li > a {
              text-align: center !important; }
    #mainHeader .mainHeader--inner {
      height: 56px; }
    #mainHeader .logo {
      width: 80px; }
#spBT {
  display: block;
 width: 40px;
  height: 40px;
  cursor: pointer;
  padding-top: 12px;
  position: relative;
  z-index: 10;
  z-index: 99999}
  #spBT span {
    background-color: #00a099;
    display: block;
    margin-top: 5px;
    margin-left: auto;
    margin-right: auto;
    width: 24px;
    height: 2px;
    position: relative;
    top: 0;
    transition: all .3s ease 0s;
    -moz-transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s; }
    #spBT span:hover {
      text-decoration: none; }
    #spBT span:first-child {
      margin-top: 0; }
  #spBT.active span:nth-child(2) {
    opacity: 0; }
  #spBT.active span:first-child {
    top: 7px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg); }
  #spBT.active span:nth-child(3) {
    top: -7px;
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg); }
	
 }
@media screen and (max-width: 768px){
/*	body{margin-right:-1em}*/
.pc-header{display: none!important;} 
.topbar {
    display: none!important;
}    
.header {
	flex-direction: column;
    margin-bottom: 10px;
}
.header #open,#close  {
    position: absolute;
    top: 20px;
    right: 12px;
}
nav ul {
	flex-direction: column;
}
nav a {color: #000;
    padding: 0.5rem;
}    
    
.header li {
	padding-top: 0;
}
/* スマホ時はMENUボタンを表示 */
#open,#close  {
    display: block;
    width: 70px;
    border: none;
    position: absolute;
    top: 0px;
    right: 12px;
        
}
    
    
#open,#close img{4em}    
/*    
.logo img{width: 80%;} */  
 .logo{padding-bottom: 1em}  
    
/* スマホ時はメニューを非表示 */
#navi {
    display: none!important;
}
    
 /*追加*/
.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 20px;
  background: #fff;
}

.logo {
  font-size: 24px;
}

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

  ここから下がハンバーガーメニュー
  に関するCSS

------------------------------*/
  
/* チェックボックスは非表示に */
.drawer-hidden {
  display: none !important;
}

/* ハンバーガーアイコンの設置スペース */
.drawer-open {
  display: flex;
  height: 60px;
  width: 60px;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 100;/* 重なり順を一番上に */
  cursor: pointer;
}

/* ハンバーガーメニューのアイコン */
.drawer-open span,
.drawer-open span:before,
.drawer-open span:after {
  content: '';
  display: block;
  height: 3px;
  width: 25px;
  border-radius: 3px;
  background: #333;
  transition: 0.5s;
  position: absolute;
}

/* 三本線のうち一番上の棒の位置調整 */
.drawer-open span:before {
  bottom: 8px;
}

/* 三本線のうち一番下の棒の位置調整 */
.drawer-open span:after {
  top: 8px;
}

/* アイコンがクリックされたら真ん中の線を透明にする */
#drawer-check:checked ~ .drawer-open span {
  background: rgba(255, 255, 255, 0);
}

/* アイコンがクリックされたらアイコンが×印になように上下の線を回転 */
#drawer-check:checked ~ .drawer-open span::before {
  bottom: 0;
  transform: rotate(45deg);
}

#drawer-check:checked ~ .drawer-open span::after {
  top: 0;
  transform: rotate(-45deg);
}
  
/* メニューのデザイン*/
	
    ul.drawer-list {list-style: none;background-color:#00A0E9;height: 100%;
	padding:2em 1em} 
	li.drawer-item01{margin:1em auto;
	border-bottom: solid 2px #fff/*#0071bc*/}
	li.drawer-item01 a{font-weight: 600;
	color: #fff}
	 li.drawer-item01 span{position: absolute; right: 1em}
	li.drawer-item{margin:0.5em auto}
li.drawer-item a{color:#fff;text-align: left;padding-left: 1.5em} 
    li.drawer-item a img{width:29px;padding-right: 1rem}    
    li.drawer-item span{margin-left:0.5em;margin-right: 1em}
    
li.drawer-item02{background-color: #333;margin: 1rem 0} 
li.drawer-item02 a{color:#fff;text-align: left;padding-left: 1.5em} 
    
.drawer-content {
  width:100%;
  height: 100%;
  position: fixed;
  top: 0;
  right: 100%;/* メニューを画面の外に飛ばす */
  z-index: 99;
  background: #fff;
  transition: .5s;
}

/* アイコンがクリックされたらメニューを表示 */
#drawer-check:checked ~ .drawer-content {
  right: 0;/* メニューを画面に入れる */
} 
    
 /**/
    
   
}  

/**/

/*
.header02 {
  transition: .3s;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 80px;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
}
.header02__logo {
  margin-left: 32px;
  width: 120px;
}
.global-nav {
  height: 100%;
  display: flex;
  align-items: center;
}
.global-nav__list {
  height: 100%;
  display: flex;
  align-items: center;
}
.global-nav__list--item {
  transition: .3s;
  height: 100%;
  cursor: pointer;
  color:  #fff;
  padding: 0 30px;
  display: flex;
  align-items: center;
}
.global-nav__list--item:hover {
  background: #EF7E00;
}
.global-nav__list--item a {
  letter-spacing: 2px;
  font-size: 1.1rem;
  text-align: center;
  display: flex;
  flex-flow: column;
}
.global-nav__list--item span {
  margin-top: .7rem;
  font-size: .7rem;
  color: #fff;
}
.contact {
  background: #EF7E00;
}
.contact:hover {
  opacity: .7;
}
*/


header {
　　background-color: rgba(255,255,255,0);
	 transition: background-color 0.2s;
}

.pc-header a{
	color:rgb(255,255,255)
}



.tbl-r04 p{
	font-size: 16px;
  display: inline-block;
    text-align: left;
}
table.tbl-r02 {
	width:90%;
  margin: 20px auto;
	font-size: 16px;
	text-align: center;
}
.tbl-r02 th {
  /*background: #e9727e;*/
  border: solid 1px #ffffff;
  color: #ffffff;
  padding: 10px ;
}
.tbl-r02 td.tbl-r03 {
　/*border: solid 1px #ffffff;*/

  padding:10px 30px;
}

/*top sdgs*/
/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc
{ display: block !important;
margin:1em;
text-align: center}
.sp 
{ display: none !important; 
margin:1em;
text-align: center}

.img_wrap{
 text-align: center   
  overflow: hidden;
}
.img_wrap img{
  width: 100%;
  cursor: pointer;
  transition-duration: 0.3s;
}
.img_wrap:hover img{
  opacity: 0.6;
  transition-duration: 0.3s;
}
 
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
    .pc { display: none !important;
    margin:1em}
    .sp { display: block !important;
margin:1em}

}


.tbl-r02 tr.tbl-r03 {
background-color: #ffffff
}
 
@media screen and (max-width: 640px) {

  .last td.tbl-r03:last-child {
    border-bottom: solid 1px #fff;
    width: 100%;
  }
  table.tbl-r02 {
    width: 100%;
  }
  .tbl-r02 th,
  .tbl-r02 td.tbl-r03 {
　　border-bottom: none;
    display: block;
    width: 100%;
  }
}

}

/**/