@charset "utf-8";/* エスケープ */
/* ==========================================================================
  Reset Css
 ==========================================================================*/
*{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;-ms-box-sizing: border-box;-o-box-sizing: border-box;}
html{font-size: 62.5%;height:100%;overflow-y:scroll;margin:0;padding:0;}
body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,
address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,
b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,
thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,
hgroup,menu,nav,section,summary,time,mark,audio,video
{font-size:100%;margin:0;padding:0;border:0;outline:0;vertical-align:baseline;list-style:none;background:transparent;font-weight:normal;font-style:normal;font-family: 'Microsoft Sans Serif',Verdana, Roboto, 'Droid Sans', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic ProN', sans-serif;-webkit-text-size-adjust: 100%;-moz-text-size-adjust: 100%;-ms-text-size-adjust: 100%;-o-text-size-adjust: 100%;text-size-adjust: 100%;/* スマホ　文字サイズ自動調整をきる */ }
body{line-height:1;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
nav ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
ins{background-color:#ff9;color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through;}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select,button,textarea{vertical-align:middle;font-family:Verdana, Roboto, 'Droid Sans', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic ProN', sans-serif;margin: 0; padding: 0; background: none;   border: none;border-radius: 0;  outline: none;  -webkit-appearance: none;   -moz-appearance: none;appearance: none;}
img {border:none;vertical-align:text-bottom;max-width: 100%;-ms-interpolation-mode: bicubic;}
.ie9 input[placeholder]{color:#5B5B5B;}
/* ==========================================================================
  Common Design
 ==========================================================================*/
 /*----------------------------------------------------
  ■リンク
----------------------------------------------------*/
a:link { color: #5B5B5B;text-decoration:none;}
a:visited { color: #5B5B5B;text-decoration:none;}
a:hover { color:#5B5B5B;text-decoration:none;}
/*----------------------------------------------------
  ■loading
----------------------------------------------------*/
#loading{position:fixed;width:100%;height:100%; background:#fff;z-index:1000;}
#loading .spinner{white-space: nowrap;text-align: center;position:fixed;left:50%;top:50%;display:block; width: 70px; height: 70px;margin: -35px 0px 0px -35px;font-size: 0;background: url("../img/base/loading.png") no-repeat center top;padding-top: 70px;}
#loading .spinner > div { font-weight: 300;font-family: 'Roboto Condensed', sans-serif;display: inline-block;margin: 0px -0.5px;-webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;animation: sk-bouncedelay 1.4s infinite ease-in-out both;}
#loading .spinner > div:after{font-size: 1.9rem;}
#loading .spinner > div:nth-child(1):after{content:"L";}
#loading .spinner > div:nth-child(2):after{content:"O";}
#loading .spinner > div:nth-child(3):after{content:"A";}
#loading .spinner > div:nth-child(4):after{content:"D";}
#loading .spinner > div:nth-child(5):after{content:"I";}
#loading .spinner > div:nth-child(6):after{content:"N";}
#loading .spinner > div:nth-child(7):after{content:"G";}
#loading .spinner .bounce1 {-webkit-animation-delay: -0.20s;animation-delay: -0.20s;}
#loading .spinner .bounce2 {-webkit-animation-delay: -0.10s;animation-delay: -0.10s;}
#loading .spinner .bounce3 {-webkit-animation-delay: 0s;animation-delay:0s;}
#loading .spinner .bounce4 {-webkit-animation-delay:0.10s;animation-delay: 0.10s;}
#loading .spinner .bounce5 {-webkit-animation-delay:0.20s;animation-delay: 0.20s;}
#loading .spinner .bounce6 {-webkit-animation-delay:0.30s;animation-delay: 0.30s;}
#loading .spinner .bounce7 {-webkit-animation-delay:0.40s;animation-delay: 0.40s;}
@-webkit-keyframes sk-bouncedelay {0%, 20%, 40%, 100% { -webkit-transform: scale(0.8) }  30% { -webkit-transform: scale(1.0) }}
@keyframes sk-bouncedelay {0%, 20%, 40%, 100% { -webkit-transform: scale(0.8);  transform: scale(0.8);} 30% {  -webkit-transform: scale(1.0);  transform: scale(1.0);}}

.ie9 #loading,.ie9 #loading .spinner{display:none!important;}
 /*tb*/
@media screen and (max-width:992px){
#loading{ background-image:none;}
}
/*----------------------------------------------------
  ■Wrapper
----------------------------------------------------*/
body{background:#f3f5f8;color:#444444;}
#wrapper{font-size:1.4rem;line-height:150%; padding: 120px 0 0 0;}
/*tb*/
@media screen and (max-width:992px){
body:not(.IndexPage){ background-image:none;}
#wrapper{padding-top: 100px;font-size:1.6rem;line-height:170%;padding-left: 0;}
}
/*sp*/
@media screen and (max-width:568px){
#wrapper{padding-top: 100px;font-size:1.4rem;min-width: 320px;}
}
/*----------------------------------------------------
  ■HEADER
----------------------------------------------------*/
#Header { width: 100%; background:#ffffff;position: fixed;top: 0; border-radius: 0;border: none; display: flex; z-index: 9999;}
#Header .h-left{display: flex;}
#Header .h-right{ position: absolute; right: 0; display: flex; flex-direction: row; justify-content: flex-end;}
#Header .logo{display: inline-block;margin:1.3em 2em 1.3em 2em; text-align:center;}
#Header .logo img{height: 6em;}
.ipad #Header .logo img{height: 124px; width:92px;}
#Header .h-sdgs{display: inline-block;margin:3.2em 2em 3.2em 0px; text-align:center;}
#Header .h-sdgs img{height: 24px;}
#Header .h-mnavi{ display: inline-block; margin: 35px 180px 35px auto; text-align: center;}
#Header .h-mnavi img{height: 50px;}
.sp-header{display: none !important;}

#Header .english a {
  color: rgba(125, 178, 40, 1.0);
  text-decoration: none;
  font-size: 1.4rem;
  padding: 3px 15px;
  text-align: center;
  display: inline-block;
  transition: .2s linear;
  border: 1px solid rgba(125, 178, 40, 1.0);
}
#Header .english a:hover { background: rgba(120, 181, 22, 0.2);}

/*tb*/
@media screen and (max-width:1200px){
  #Header .logo {
    margin: 1.5em 1.5em 1.5em 1.5em;
  }
  #Header .h-sdgs {
    margin: 3.5em 2em 3.2em 0px;
  }
  #Header .logo img{height: 5em;}
  .ipad #Header .logo img{height: 70px; width:51.9333px;}
  #Header .h-sdgs img {
    height: 20px;
  }
}
@media screen and (max-width:1140px){
#Header {margin-left: 0; left:0; width: 100%; background:#ffffff;height: 100px;padding: 0;z-index: 99;text-align:center;}
#Header .logo img { height: 4.4em;}
#Header .h-right { right: 100px;}
.pc-header{display: none !important;}
.sp-header{display: block !important;}
#Header .h-sdgs { display: block; margin: 1em auto; padding: 1.2em 1em; text-align: center; background: #fff; width: 90%;}
#Header .h-mnavi { display: block; margin: 1em auto; padding: 1em; text-align: center; background: #fff; width: 90%;}
#Header .english { display: block; position: fixed; top:35px; left: 15px;}
}

/*----------------------------------------------------
  ■GrandMenu 
----------------------------------------------------*/
nav .GNavi > ul{margin: auto; padding: 50px 0 0 0; border-top:1px solid #e5e5e5; display: flex; height: 120px;}
nav .GNavi ul li a span{display: block;color:#222222;font-size: 1.6rem;}
nav .GNavi ul li.english { margin-top: -5px; margin-right: 10px;}

nav .GNavi ul.submenuItems li:before{ top: 28px;}
nav .GNavi ul li a:hover:before,
nav .GNavi ul li div:hover:before{opacity:1;width:100%;left:0;}
.contact{ position: absolute; right: 0; }
.contact a{ color: #fff; text-decoration: none; font-size: 1rem; padding: 47px 40px; text-align: center; display: block; background: rgba(125, 178, 40, 1.0); line-height: 140%; height: 100%;}
.contact a span{display: block;color:#fff;font-size: 1.6rem;}
.contact:before{ display:none;}
.contact a:before{background: rgba(255, 255, 255, 0.1);}
.translation{ margin-left: 15px; margin-top: 40px;}
.translation a{ color: rgba(125, 178, 40, 1.0); text-decoration: none; font-size: 1.6rem; padding: 5px 20px; text-align: center; display: inline-block; transition:.2s linear; border: 1px solid rgba(125, 178, 40, 1.0);}
.translation a:hover { background: rgba(120, 181, 22, 0.2);}
nav .GNavi .close,
.GNaviButton{display:none;}

/*tb*/
@media screen and (max-width:1140px){
nav .GNavi {display:block;}
nav .GNavi{opacity:0;height:0;z-index: 999;overflow:hidden;position: fixed;margin-top: 0;top: 0;width: 100%;background: rgba(120, 181, 22, 0.6);transition:.2s linear;-moz-transition:.2s linear;-webkit-transition:.2s linear;-o-transition:.2s linear;-ms-transition:.2s linear;-webkit-transform:translateY(-100px);-ms-transform:translateY(-100px);transform:translateY(-100px);}
nav .GNavi.open {opacity:1;height: 100%;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);overflow-y: auto;}
nav .GNavi ul li{background: rgba(120, 181, 22, 0.8);width: 100%;display: block;border-bottom: 1px solid rgba(255, 255, 255, 0.35);}
nav .GNavi ul li a{text-align: left;height: auto;padding:20px;font-size: 1.6rem;display: block;color: #fff;font-family: inherit;transition: all 0.4s ease-out;}
nav .GNavi ul li a:hover,
.dropdownlink:hover {background-color: #CDDC39;}
nav .GNavi ul li a:before,
nav .GNavi ul li a:after{display: none!important;}
nav .GNavi .close{cursor:pointer;display: block;font-family: FontAwesome,'Microsoft Sans Serif','メイリオ', Meiryo,sans-serif;color: #fff;text-align: right;padding: 10px;}
nav .GNavi .close:after{content: "\f00d\0020閉じる";} 
.GNaviButton{cursor:pointer;display: block;width: 40px;height: 40px;text-align: center;line-height: 40px;font-size: 3.8rem;color: #b7b7b7;position: fixed;top: 30px;right: 30px;font-family: FontAwesome;z-index: 20;}
.GNaviButton:after{content: "\f0c9";}
nav .GNavi ul li a span,
nav .GNavi ul li.contact a span{ display:none;}
nav .GNavi ul li:before{border-top: solid 1px #fff;border-right: solid 1px #fff;}
nav .GNavi ul li.contact{padding:0;}
nav .GNavi ul li.contact a{padding:20px;text-align:left;;background: none;font-size: 1.6rem;transition: all 0.4s ease-out;}
nav .GNavi ul li.contact a:hover {background-color: #CDDC39;}
nav .GNavi ul li.contact:before{ display:block;}
nav .GNavi ul li div:hover:before{opacity:0;width:100%;left:0;}
.contact a { padding: 36px 30px;}
nav .GNavi > ul { margin: auto; padding: 0; border-top: 1px solid #e5e5e5; display: block; align-items: center; height: 292px;}
.translation{ margin-left: 0px; margin-top: 0px; position: fixed; top: 35px; left: 15px;}
.translation a{ font-size: 1.4rem; padding: 3px 15px;}
}
nav .GNavi ul li.sp-menu-banner{ background: none; }

/*----------------------------------------------------
  ■SNS
----------------------------------------------------*/
header .sns{ position: fixed; right: 0; top: 200px; z-index: 10; }
header .sns div a{ display: flex; width: 80px; height: 80px; align-items: center; justify-content: center; }
header .sns div.sns-insta a{ background: #9b42d4; }
header .sns div.sns-yt a{ background: #ef4138; }
header .sns div.sns-con a{ background: #7db228; }
header .sns div a img{ display: block; width: 40px; }
header .sns div a:hover{ opacity: .7; }

/*tb*/
@media screen and (max-width:1140px){
header .sns div a{ width: 60px; height: 60px;}
header .sns div a img{ width: 30px; }

}

/*----------------------------------------------------
  ■Container
----------------------------------------------------*/
#Container{width:100%;}
#Container .package{ width:100%;max-width:1480px;margin:auto; padding:20px;}
#Container .inner{ width:100%;margin:auto; padding:20px;}
#Container .innerBox{ width:100%;margin:auto; padding:30px;background:#fff;line-height:220%;}
#Container .innerBox.en{ line-height:180%; font-size: 1.5rem;}

 /*tb*/
@media screen and (max-width:992px){
#Container .package{ padding:20px 0px;}
#Container .innerBox{ line-height:180%;}
}
 /*sp*/
@media screen and (max-width:568px){
#Container .inner{ padding:35px 15px 15px 15px;}
#Container .innerBox{padding:25px 10px;}
}

/*----------------------------------------------------
  ■Footer
----------------------------------------------------*/
/*Footer Contact*/
.footerContact .inner{ display:table;}
.footerContact .inner > a{ width:33.33333333333333%; display:table-cell; vertical-align: top; position: relative; transition: background-color 0.2s linear;}
.footerContact .inner > a:nth-child(1){background-color: #208639; color: #fff;cursor:default;pointer-events:none;}
.footerContact .inner > a:nth-child(1) p{ margin-top: 15px;}
.footerContact .inner > a:nth-child(2){background-color: #fff; border-right:1px solid #e1e1e1;}
.footerContact .inner > a:nth-child(3){background-color: #fff;}
.footerContact .inner > a:nth-child(2):hover,
.footerContact .inner > a:nth-child(3):hover{background-color: #f7fff9;}
.footerContact .inner .contact,
.footerContact .inner .tel{ width:100%; padding-top: 15px; text-align: center;}
.footerContact .inner .contact span.contacticon,
.footerContact .inner .tel span.contacticon{ width: 70px; height: 70px; display: inline-block;font-size:3.0rem; padding-top: 20px;text-align: center; background: #208639; color: #fff;border-radius: 50%;}
.footerContact .inner .tel span.contacticon{font-size:3.4rem;}

.footerContact .inner .contact h2 span{ font-size:4.6rem;color:#fff; line-height:130%; display: block;}
.footerContact .inner .contact{ width:100%; padding-top: 20px; text-align: center;}
.footerContact .inner .contact p,
.footerContact .inner .tel p{ font-size: 1.7rem; margin-top: 10px; line-height: 140%;}
.footerContact .inner .tel p span{font-size: 3.8rem; display:block;padding: 10px 0 7px 0;}

.footerContactfull .inner{ width: 100%; max-width: 800px; margin: auto;}
.footerContactfull .inner > a{ width:100%; display: block; padding: 40px 15px; text-align: center; background-color: #208639; color: #fff; position: relative; transition: background-color 0.2s linear;}
.footerContactfull .inner h2 span{ font-size:4.6rem;color:#fff; line-height:130%; display: block;}
.footerContactfull .inner p{ font-size: 1.7rem; margin-top: 10px; line-height: 140%;}
.footerContactfull .inner p span{font-size: 3.8rem; display:block;padding: 10px 0 7px 0;}

.footerContactfull.h_haf .inner > a{ width:100%; max-width: 800px; padding: 15px; background-color: #288483;}
.footerContactfull.h_haf .inner p{ margin-top: 0px;}

/*Footer*/
#Footer{width: 100%;margin: auto; padding:10px 5px 0 5px; background:#208639; display:table;}
#Footer .FNavi {width: 480px;display:table-cell;}
#Footer .FNavi ul{float:left;}
#Footer .FNavi ul li{display:inline-block; margin-left:10px; color:#fff;}
#Footer .FNavi ul li a{color: inherit;text-decoration: none;white-space: nowrap;display:inline-block;}
#Footer .FNavi ul li a:hover { color:#fff;filter:alpha(opacity=80);-moz-opacity: 0.8;opacity: 0.8;}
#Footer .FNavi ul li a:before{content: "\f105";font-size: 1.6rem;color: #fff; line-height:120%;font-family: FontAwesome; margin-right:5px;}
#Footer .FNavi .c-name{ float:left;margin-left:10px; color:#fff;font-weight:800;font-family: 'Microsoft Sans Serif','メイリオ', Meiryo,sans-serif;}

#Footer .copy{display:table-cell;vertical-align: top;}
#Footer .copy small{font-family: 'Microsoft Sans Serif',sans-serif; color:#fff;font-size: 1.2rem;}

 /*pc*/
@media screen and (max-width:1200px){
/*Footer Contact*/
.footerContact .inner .contact p,
.footerContact .inner .tel p{ font-size: 1.5rem; margin-top: 10px; line-height: 140%;}
.footerContact .inner .tel p span{font-size: 2.4rem; display:block;}
}

 /*tb*/
@media screen and (max-width:992px){
/*Footer Contact*/
.footerContact .inner{ display:block;}
.footerContact .inner > a{ width:100%; height: auto; display:block;}
.footerContact .inner > a:nth-child(1) p{ margin-top: 15px;}
.footerContact .inner > a:nth-child(2){border-right:0;border-bottom:1px solid #e1e1e1;}
.footerContact .inner .contact h2 span{ font-size:3.4rem;line-height:130%;}
.footerContact .inner .contact,
.footerContact .inner .tel{ padding: 8%;display: table;}
.footerContact .inner .contact.form p,
.footerContact .inner .tel p{ display: table-cell; vertical-align: middle; text-align: left;}
.footerContact .inner .contact.form p:nth-child(1),
.footerContact .inner .tel p:nth-child(1){ width:100px;}

.footerContactfull .inner > a{ padding: 30px 15px;}
.footerContactfull .inner h2 span{ font-size:3.4rem; line-height:130%;}
.footerContactfull .inner p{ font-size: 1.5rem;}
.footerContactfull .inner p span{font-size: 2.4rem;}

/*Footer*/
#Footer{padding:0;display:block;}
#Footer .FNavi,
#Footer .copy {width:100%;padding:0; margin:0;display:block;text-align: center;}
#Footer .FNavi ul{text-align: center;float:none;}
#Footer .copy{margin-top:10px;}
#Footer .FNavi .c-name{text-align: center;float:none;width:100%;display:block;margin-bottom:5px;margin-left: 0;}
}

/*sp*/
@media screen and (max-width:568px){
/*Footer Contact*/
.footerContact .inner .tel p{ font-size: 1.2rem;}
.footerContact .inner .tel p span{font-size: 1.8rem;}

/*Footer*/
#Footer{padding:0;display:block;}
#Footer .FNavi { margin:0;display:block;}
#Footer .FNavi ul{width:100%;display:table;}
#Footer .FNavi ul li{width:50%; display:table-cell; margin:0;text-align: center;}
#Footer .FNavi ul li span{display: block;text-align: center;}
#Footer .FNavi ul li a{width:100%; height:78px;padding:15px 0;display: block;}
#Footer .FNavi ul li a:hover{ background-color:#208639;}
#Footer .FNavi ul li:nth-child(1) a{padding:30px 0;}
#Footer .FNavi ul li:nth-child(2){border-left:1px solid #fff; vertical-align:top;}
#Footer .FNavi .c-name,
#Footer .FNavi ul li a:before{display:none;}
#Footer .copy {width:100%; border-top:1px solid #fff; padding:10px;margin:0;}
#Footer .copy small{font-size: 1.1rem;}
}
/*----------------------------------------------------
  ■PageTop
----------------------------------------------------*/
#pagetop{right: -80px;bottom:-80px;opacity:0;text-decoration:none;transition:0.3s;-moz-transition:0.3s;-webkit-transition:0.3s;-o-transition:0.3s;display: block;width: 50px;height: 50px;position: fixed;background:url(../img/base/to-page-top.png) 0 0 no-repeat; background-size:50px 50px;text-align: center;z-index: 999;}
#pagetop.fixed{bottom: 60px;right: 10px;opacity: 1;}
#pagetop:hover{opacity:0.6;}
#pagetop{position: fixed;}

/*sp*/
@media screen and (max-width:568px){
#pagetop{width: 50px;height: 50px;background-size:50px 50px;}
}

/*----------------------------------------------------
  ■TopicPath
----------------------------------------------------*/
nav#TopicPath ol{ width:100%;max-width:1480px;margin:5px auto 0 auto; padding:5px 40px;}
nav#TopicPath ol li { display:inline;list-style-type:none; font-size:90%;}
nav#TopicPath ol li:before {content: " > ";}
nav#TopicPath ol li:first-child:before {content:"\f015";font: normal normal normal 20px/1 FontAwesome;margin-right: 5px; color:#208639;}
/*tb*/
@media screen and (max-width:992px){
nav#TopicPath ol{padding: 0px 8px; width: 100%;}
}
/*tb*/
@media screen and (max-width:568px){
nav#TopicPath{ display:none;}

}