@charset "UTF-8";

:root {
  --color1: #000;/*header tel*/
  --color2:#e47911;/*header tel hover*/
  --maincolor:#004ea1;
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　初期設定　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&family=Noto+Sans+JP&display=swap');

*{
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
body, nav, ul, li, a {margin: 0; padding: 0;}
a {text-decoration: none;}
ol, ul {
  list-style: none;
}
li {
  list-style-type: none;
}

body {
width:100%;
background:#faf7f0;
}
.wrapper {
overflow:hidden;
}
header {
position:fixed;
width:100%;
top:0;
background:#FFF;
z-index:999999;
}
footer {
color:#FFF;
font-size:.9em;
}

.formInput05 { width: 5em; max-width: 100%; box-sizing: border-box; display: inline-block; margin:0px 3px;}
.formInput10 { width: 10em; max-width: 100%; box-sizing: border-box; display: inline-block; margin:0px 3px;}
.formInput15 { width: 15em; max-width: 100%; box-sizing: border-box; display: inline-block; margin:0px 3px;}
.formInput20 { width: 20em; max-width: 100%; box-sizing: border-box; display: inline-block; margin:0px 3px;}
.formInput25 { width: 25em; max-width: 100%; box-sizing: border-box; display: inline-block; margin:0px 3px;}
.formInput30 { width: 30em; max-width: 100%; box-sizing: border-box; display: inline-block; margin:0px 3px;}
.formInput40 { width: 40em; max-width: 100%; box-sizing: border-box; display: inline-block; margin:0px 3px;}

/* other
--------------------------- */
@media screen and (min-width: 768px) {
	.br-sp { display:none; }
}

@media screen and (max-width: 1024px) {
	.br-sp2 { display:none; }
}

a:focus, *:focus, a:hover {
	outline:none;
	text-decoration: none;
}

.bg_white {
	padding:3%;
	background:#FFF;
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝　common　＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.maincontainer {
	max-width:1200px !important;
  margin: 0 auto;
  padding-left: 7px;
  padding-right: 7px;
}
.maincontainer2 {
	max-width:1000px !important;
	margin-left:auto;
	margin-right:auto;
}
.maincontainer-wide {
	max-width:1400px !important;
	margin-left:auto;
	margin-right:auto;
}
.rl15-container {
  max-width: 900px;
  position: relative;
  margin: 0 auto;
  padding-left: 15px;
  padding-right: 15px;
}

.rl80-container {
  max-width: 800px;
  position: relative;
  margin: 0 auto;
  padding-left: 15px;
  padding-right: 15px;
}

.rl60-container {
  max-width: 600px;
  position: relative;
  margin: 0 auto;
  padding-left: 45px;
  padding-right: 45px;
}
.kanri-container {
  max-width: 1100px;
  position: relative;
  margin: 0 auto;
  padding: 5px;
}

p.lead {
font-size:1em;
line-height:1.8em;
padding:5rem 0.5em;
}
@media screen and (max-width: 1024px) {
p.lead {
padding:2rem 0.5em;
}
}

p.lead2 {
margin:1.2em 1em;
font-size:1em;
}

span.red {
	color: #c00;
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝　ナビゲーション　＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.header_area {
  display: flex;
max-width:1200px;
margin-right:auto;
margin-left:auto;
align-items:center;
height:87px;
}
.header_area > div:first-of-type {
margin-right: auto;
}
.header_icon_PC {
text-align:right;
}
.header_icon_PC.header_icon_TEL a{
font-size:1.5rem;
font-weight:bold;
color:#000;
}
.header_icon_TEL a:hover {
color:var(--color2);
}
.logoB {
  display: flex;
align-items:center;
}

.logoB img {
max-width:220px;
padding-left:3%;
}

.logo_lead {
font-size:1.1rem;
margin-left:15px;
font-weight:bold;

}
.logoB p{
margin-bottom:0;
}

@media screen and (max-width: 1024px) {
.logoB {
flex-direction:column-reverse;
align-items:stretch;
}
.logoB img {/*sp*/
max-width:180px;
padding-left:1%;
}
.logo_lead {
margin:0;
font-size:0.8rem;
}
}

.header_icon {
display:flex;
flex-direction:column;
justify-content:flex-end;
padding-right:2%;
}
@media screen and (min-width: 1024px) {
.header_icon_SP {
display:none;
}
}
@media screen and (max-width: 1024px) {
.header_icon_PC {
display:none;
}
.header_icon {
text-align:center;
}
.header_icon_SP a {
font-size:1.5rem;
color:#000;
}
.header_icon_SP a:hover {
color:var(--maincolor);
}
}


.btn-square-so-pop {
  position: relative;
width:125px;
text-align:center;
  display: inline-block;
  padding: 0.25em 0;
margin-right:5px;
  text-decoration: none;
  color: #FFF;
  border-radius: 8px;/*角の丸み*/
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
  font-weight: bold;
background:#a48636;
}

.btn-square-so-pop:active {
  /*押したとき*/
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}
.btn-square-so-pop:hover {
  background:var(--color2);
  color:#FFF;
}

@media screen and (min-width: 1024px) {
.sp_nav {
	display:none;
	}
}


/* ＝＝＝＝＝＝＝＝＝＝＝＝＝　footer navi　＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.footer_bg {
background: linear-gradient(180deg, #06488e 0%, #0854a5 40%, #0c6cd2 80%);
padding:2rem;
}
.footer_logo img {
filter: brightness(0) invert(1);
max-width:220px;
}

.footer_tel {
font-size:1.1rem;
border:solid 2px #FFF;
border-radius:50px;
margin:10px;
text-align:center;
padding:2%;
}

.copyright {
border-top:solid 1px #FFF;
padding:8px 0 0;
text-align:right;
font-size:0.8em;
}

@media screen and (max-width: 768px) {
.copyright {
text-align:center;
}
}

/*==========================================================================*/
@media (max-width: 1024px) {
.menu {
 /* メニューの位置マイナス指定で画面外に */
  position: fixed;
  left: -100%;
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
justify-content:flex-start;
  background-color:var(--maincolor);
  transition: .3s;
z-index:999;
}
.menu.open {
  left: 0;
padding:0;
}
}

/* =============================================================================== */

.toggleMenu {
display:table;
  height: 100%;
  padding:1.2em 1.4em;
  font-size: 0.9rem;
  text-transform: uppercase;
  color: #000;/*MENU の文字の色*/
  font-weight: bold;
  right: 0;
left:auto;
background:#eee;
  border-left: 1px solid #f2f2f2;
}
.toggleMenu span {
  /* vertically align inside parent element */
  display: table-cell;
  vertical-align: middle;
}
.toggleMenu span, .toggleMenu span::after, .toggleMenu span::before {
  /* this is the menu icon */
  display: block;
  position: relative;
  height: 2px;
  width: 30px;
  background: #25283D;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  bisibility:hidden;
}
.toggleMenu span {
  /* this is the menu central line */
  margin: 14px auto 14px;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
}
.toggleMenu span::before, .toggleMenu span::after {
  position: absolute;
  content: '';
  left: 0;
  -webkit-transition: -webkit-transform .2s;
  transition: -webkit-transform .2s;
  transition: transform .2s;
  transition: transform .2s, -webkit-transform .2s;
}
.toggleMenu span::before {
  /* this is the menu icon top line */
  -webkit-transform: translateY(-6px);
      -ms-transform: translateY(-6px);
          transform: translateY(-6px);
}
.toggleMenu span::after {
  /* this is the menu icon bottom line */
  -webkit-transform: translateY(6px);
      -ms-transform: translateY(6px);
          transform: translateY(6px);
}
@media only screen and (min-width: 1024px) {
.toggleMenu {
    display: none;
  }
}
.toggleMenu.open span{
  /* transform menu icon into a 'X' icon */
  background: rgba(255, 255, 255, 0);
}
.toggleMenu.open span::before {
  /* rotate top line */
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
.toggleMenu.open span::after {
  /* rotate bottom line */
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}

/* =============================================================================== */
.nav-wrapper {
background:var(--maincolor);
border-bottom:solid 3px #a48636;
}
.main-wrapper {
max-width:1200px;
margin:0 auto;
}

/* =====================================================================================================================

ナビゲーションドロップダウンのためのCSS

===================================================================================================================== */
.gloval-navi {
  display: flex;
  justify-content:center;
  align-items:center;
}
.gloval-navi li li {
display:block;
}
.gloval-navi li {
  text-align: center;
  transition: all .3s ease-in-out;
display:block;
}

.gloval-navi > li {
width:20%;
position:relative;/*navとnavの間の | の線 のための*/
}
.gloval-navi > li:not(:first-child)::before {/*navとnavの間の | の線 */
position:absolute;
display:block;
content:"";
top:50%;
height:14px;
margin-top:-7px;
border-right:1px solid #FFF;
}
.gloval-navi li a {
padding:10px;
display:block;}

.gloval-navi li a:hover,
.gloval-navi li a:active  {
  background: #67a7cc;
}

.gloval-navi a {
 color: #FFF;
  text-decoration: none;
display:block;
}

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*==1024px以下の形状*/
@media screen and (max-width:1024px){
.gloval-navi {
    padding: 0;
flex-direction:column;
display:block;/*.gloval-navi a 　でやっていたら、menu　の位置がずれた:修正*/
  }

.gloval-navi a {
 color: #FFF;
}
.gloval-navi > li {
width:100%;
}
  
.gloval-navi li a{
text-align:left;
  border-bottom:1px solid #000;

}
.gloval-navi > li:not(:first-child)::before {
height:0;
border:none;
}
}
@media screen and (min-width:1024px){
.gloval-navi li.sp_nav {
	display:none;
	}
}

span.en {
    display:  block;        /* ブロック要素にする */
    font-size:  10px;       /* 文字サイズ指定 */
    margin-top:  0px;      /* 周りの余白指定 */
    position:  relative;    /* 位置調整 */
    width: auto;           /* 幅指定 */
text-align:center;
}

li.smallfontTT a {
font-size:0.9rem;
}
@media (max-width: 1024px) {
span.en {
display:none;
}
li.smallfontTT a {
font-size:1rem;
}
}

section + section {
margin-bottom:120px;
}