@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Pacifico);
@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);
@import url(https://fonts.googleapis.com/css?family=Josefin+Sans);
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@500;700;800&display=swap');
/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;}
ul{list-style:none;}
table{border-collapse:collapse;border-spacing:0;}
caption,th{text-align:left;}
q:before,q:after{content:'';}
object,embed{vertical-align:top;}
legend{display:none;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
img,abbr,acronym,fieldset{border:0;}

body{
	font: 16px 'Noto Sans JP', Arial, Verdana, 游ゴシック, YuGothic,'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo,sans-serif;
	font-weight: 300;
	-webkit-text-size-adjust:100%;
	overflow-x: hidden;
	color: #000;
	background: #fff;
	font-size: 18px;
}

a{
	color: #0066ff;
	text-decoration: none;
}

a:hover, .active{
  text-decoration: underline;
}

a:active, a:focus,input:active, input:focus{outline:0;}

.c_both {
	clear: both;
}
#wrapper {
	position: relative;
	margin: 0 auto;
	max-width: 750px;
	overflow: hidden;
}



/* ヘッダー
------------------------------------------------------------*/
#header{
	position: relative;
    overflow:hidden;
    width: 100%;
    /*height: 750px;*/
}

.logo {
	position: absolute;
}
.logo img {
	height: 40px;
    margin-top: 13px;
    margin-top: 13px;
	width: auto;
}
.main_logo {
	margin: 56px 50% 20px;
    width: 50% !important;
	z-index: 10;
}


.phone {
    font-size: 40px;
    color: #fff;
    line-height: 62px;
    position: absolute;
    right: 60px;
}
.fa-phone-square:before {
    content: "\f098";
}
.line {
    font-size: 40px;
    color: #fff;
    line-height: 62px;
    position: absolute;
    right: 110px;
}
.fa-line:before {
    content: "\f3c0";
}

/*------- slogan -------*/

@keyframes typing { from { width: 0; } }
@keyframes caret { 50% { border-color: transparent; } }
#slogan .top_copy {
	font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
	color: #000;
	font-size: 22px;
	font-weight: bold;
	width: 28ch;
    border-right: .08em solid;
    overflow: hidden;
    white-space: nowrap;
    animation: typing 5s steps(28, end), caret .5s step-end infinite;
}
#slogan{
	position: absolute;
    top: 75px;
	width: 100%;
	color: #fff;
	line-height: 1.2;
	text-align: center;
　opacity:0;
  animation-name:slogan;
  animation-duration:4s; 
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
	z-index: 400;
}
@keyframes slogan {
0% {
 opacity: 0;
 transform: translateY(-100px);
}
  100%{
    opacity: 1;
    transform: translateY(0);
  }
}

#slogan h1{
	font-size: 40px;
	font-family: 'Pacifico', cursive;
	margin: 20px;
	font-weight:normal;
	color: #0a69b7;
	display: none;
}
#slogan h2{
	font-size: 20px;
	padding: 90px 20% 0 0px;
	font-weight:normal;
}


#slogan_text {
	text-align: center;
　opacity:0;
  animation-name:slogan_text;
  animation-duration:5s; 
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  background: radial-gradient(#ffffff, #7297ff);
    padding: 40px 0;
    margin-top: -50px;
	text-shadow:1px 0 0 #fff,0 1px 0 #fff,-1px 0 0 #fff,0 -1px 0 #fff;
}
@keyframes slogan_text {
0% {
 opacity: 0;
 transform: translateY(100px);
}
  100%{
    opacity: 1;
    transform: translateY(0);
  }
}


/*------ top_img ------*/

/*--- cssアニメーション ここから ---*/
.smoke {
  margin: 0 auto;
	position: absolute;
    width: 70%;
    left: 40%;
    top: 150px;
	z-index: 15;
}
.smoke img {
  animation: anime1 2s ease 0s 1 alternate;
  transform-origin:center;
}
@keyframes anime1 {
  from {
    transform: scale(0.2,0.2);
  }
  to {
    transform: scale(1,1);
  }
}

/*--- cssアニメーション ここまで ---*/
.fade_img_01 { 
  position: relative;
  color: white;	
  width: 100%;
  padding-top: 120px;	
　opacity:0;
  animation-name:fade_img_01;
  animation-duration:3s; 
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  z-index: 10;
}
@keyframes fade_img_01 {
0% {
 opacity: 0;
 transform: translateX(-200px);
}
  100%{
    opacity: 1;
    transform: translateX(0);
  }
}
.fade_img_01 p {
	text-align: left;
	line-height: 1.2;
}
.fade_img_01 h2 {
	font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
	position: absolute;
	top: 45%;
	right: 2%;
	text-align: center;
	line-height: 1.4;
	text-shadow: #000 -1px 1px 10px;
	z-index: 100;
}

/*--- cssアニメーション ここから ---*/
.smoke2 {
  margin: 0 auto;
	position: absolute;
    width: 70%;
    right: 40%;
    top: 85px;
	z-index: 5;
}
.smoke2 img {
  animation: anime1 2s ease 0s 1 alternate;
  transform-origin:center;
}
@keyframes anime1 {
  from {
    transform: scale(0.2,0.2);
  }
  to {
    transform: scale(1,1);
  }
}

/*--- cssアニメーション ここまで ---*/
.fade_img_02 { 
  position: relative;
  color: white;
  width: 100%;
  margin-top: -108px;	
　opacity:0;
  animation-name:fade_img_02;
  animation-duration:3s; 
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
	z-index: 5;
}
@keyframes fade_img_02 {
0% {
 opacity: 0;
 transform: translateX(200px);
}
  100%{
    opacity: 1;
    transform: translateX(0);
  }
}


.fade_img_02 p {
	line-height: 1.2;
	text-align: right;
	color: #000;
}
.fade_img_02 h2 {
	font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
	position: absolute;
	top: 45%;
	left: 2%;
	text-align: center;
	line-height: 1.4;
	text-shadow: #000 -1px 1px 10px;
	z-index: 10;
}
.fadein{
  opacity:1;
  transform:translateX(0);
}


/* フッター
------------------------------------------------------------*/
#footer{
	clear: both;
	padding: 60px 10px 60px 0;
	text-align: center;
	font-size: 12px;
	background: #0a69b7;
}


/* 共通
------------------------------------------------------------*/
h1, h2{
	font-family: 'Josefin Sans', 'Noto Sans JP',serif;
}

img{
	width: 100%;
	height: auto;
}

section{
	clear:both;
}

section h2{
	font-size: 30px;
	font-weight: bold;
	text-align: center;
	padding: 100px 0 30px;
}

.inner{
	width: 90%;
	margin: 0 auto;
}

.col2 li{
	display: inline-block;
	width: 100%;
  	margin: 20px 0 20px 0;
}

/*--------  ふわっと出る ---------*/
.fade{
  position: relative;
  opacity : 0;
  transform: translateY(130px);
  transition: all 1s;
}

/* SEC01 入店特典
------------------------------------------------------------*/

#sec01 {
	position: relative;
/*	background-image: url(../images/sec_01_bg.jpg);
	background-repeat: no-repeat;*/
	padding-bottom: 80px;
}
#sec01 h2 {
	position: relative;
	padding: 20px 0 10px;
}
#sec01 h2:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 80%;
  margin-left: 10%;
  height: 6px;
  content: '';
  border-radius: 3px;
  background-image: -webkit-gradient(linear, right top, left top, from(#2af598), to(#009efd));
  background-image: -webkit-linear-gradient(right, #2af598 0%, #009efd 100%);
  background-image: linear-gradient(to left, #2af598 0%, #009efd 100%);
}
#sec01 .bg01 {
	background-image: url(../images/sec_01_01.png);
	background-size: cover;
}
#sec01 .bg01_01 {
	background-image: url("../images/sec_01_bg.png");
	background-size: cover;
	padding-top: 10%; padding-left:40%;padding-right: 5%;padding-bottom: 100px
}
#sec01 .bg01_02 {
	background-image: url(../images/sec_01_bg_02.png);
	background-size: cover;
}
#sec01 .bg02 {
	background-image: url(../images/sec_01_02.png);
	background-size: cover;
}
#sec01 .bg03 {
	background-image: url(../images/sec_01_03.png);
	background-size: cover;padding-top: 10%;padding-left:40%;padding-right: 5%;padding-bottom: 100px
}
#sec01 .bg04 {
	background-image: url(../images/sec_01_04.png);
	background-size: cover;
	    background-position: center;padding-top: 10%;padding-left:5%;padding-right:40%;padding-bottom: 100px
}
#sec01 .bg05 {
	background-image: url(../images/sec_01_05.png);
	background-size: cover;padding-top: 10%;padding-left:40%;padding-right: 5%;padding-bottom: 100px
}

.sec_01_title {
/*	font-family:;*/
	font-size: 22px;
	font-weight: bold;
	margin-bottom: 6%;
	padding-top: 10%;
	color: #0b318f;
	text-shadow:1px 0 0 #fff,0 1px 0 #fff,-1px 0 0 #fff,0 -1px 0 #fff,2px 2px 0 #fff;
}
.sec_01_title .number {
	font-family: "brush-script-std";
	font-style: italic;
	font-size: 36px;
	font-weight: bold;
	line-height: 1;
    float: left;
    text-align: center;
	margin-right: 7px;
	text-shadow:1px 0 0 #fff,0 1px 0 #fff,-1px 0 0 #fff,0 -1px 0 #fff,2px 2px 0 #fff;
}

.sec_01 p {
	margin-left: 0%;
	text-shadow:1px 0 0 #fff,0 1px 0 #fff,-1px 0 0 #fff,0 -1px 0 #fff;
}

.fade_l{
  transform:translateX(-150px);
  opacity:0;
  transition:opacity 1s,transform 0.5s;
  padding: 5% 6% 5% 40%;	
}

.fade_l:first-of-type{
  margin: 0;
}
.fade_r{
  transform:translateX(150px);
  opacity:0;
  transition:opacity 1s,transform 0.5s;
  padding: 5% 38% 5% 6%;	
}

.fade_r:first-of-type{
  margin: 0;
}
#sec01 .fadein{
  opacity:1;
  transform:translateX(0);
}


/* SEC02 圧倒的な集客率
------------------------------------------------------------*/
#sec02 {
	background: #0a69b7;
	transform:skew(0deg, -18deg);
	padding-bottom: 100px;
}
#wrap{
	transform:skew(0deg, 18deg);
}
.sec_02 {
	padding: 25px 0;
}
.sec_02 .title {
	color: yellow;
	font-weight: bold;
	clear: both;
}
.sec_02 p {
	color: #fff;
    font-weight: bolder;
	/*text-shadow:#0a69b7 1px 1px 5px,#0a69b7 -1px 1px 5px,#0a69b7 1px -1px 5px,#0a69b7 -1px -1px 5px;*/
}
.sec_02 table {
	font-weight: bold;
}
.sec_02 #arrow {
	text-align: center;
	color:#ff0;
	font-size: 36px;
	margin: -10px 0 0;
}

.sec_02_01 {
	background-image: url(../images/item_01.png);
	background-size: cover;
}
.sec_02_01 img {
	width: 50%;
	margin-right: 3%;
	float: left;
}

.sec_02_02 {
	background-image: url(../images/item_02.png);
	background-size: cover;
}
.sec_02_02 img {
	width: 40%;
	margin-left: 3%;
	float: right;
}
.sec_02_02 span {
	color: #ff0;
	font-weight: bold;
}
.sec_02_02 th, td {
    padding: 0px 1px !important;
}

.sec_02_03 {
	overflow: hidden;
	background-image: url(../images/item_02.png);
	background-size: cover;
}

.sec_02_03 .img01 {
	position: relative;
	padding-top: 10px;
}
.sec_02_03 .img01 .text1 {
	position: absolute;
	top: 59px;
    left: 10px;
    font-size: 16px;
	font-weight: bold;
	color: #fff;
}
.sec_02_03 .img01 .text2 {
	position: absolute;
	top: 59px;
    right: 10px;
    font-size: 16px;
	font-weight: bold;
	color: #fff;
}
.sec_02_03 .img01 .text3 {
	position: absolute;
	top: 194px;
    left: 10px;
    font-size: 15px;
	font-weight: bold;
	color: #fff;
}
.sec_02_03 .img01 .text4 {
	position: absolute;
	top: 194px;
    right: 5px;
    font-size: 15px;
	font-weight: bold;
	color: #fff;
}

.sec_02_03 .img02 {
}

.sec_02_04 {
	overflow: hidden;
	background-image: url(../images/item_03.png);
	background-size: cover;
}


.sec_02_04 .img01 {
	position: relative;
	background-image: url(../images/sec_02_05.png);
	background-repeat: no-repeat;
	background-size: cover;
	margin-top: 10px;
	padding-bottom: 215px;
	font-size: 13px;
	font-weight: bold;
	text-align: center;
}
.sec_02_04 .img01 .text1 {
	float: left;
	width: 33%;
	padding: 120px 0px 0px;
}
.sec_02_04 .img01 .text2 {
	float: left;
	width: 33%;
	padding: 120px 0px 0px;
}
.sec_02_04 .img01 .text3 {
	float: left;
	width: 33%;
	padding: 120px 0px 0px;
}
.sec_02_04 .img01 .li2 {
	color: #F732D1;
}
.sec_02_04 #arrow {
	text-align: center;
	color:#ff0;
	font-size: 36px;
	margin: -10px 0 0;
}



/* SEC03 月収実例
------------------------------------------------------------*/

#sec03{
	padding-bottom: 50px;
}
#sec03 h2 .title{
	color: #F000FF;
	font-size: 18px;
}
#sec03 img {
	margin-bottom: -6px;
}


/* SEC04 スタッフの声
------------------------------------------------------------*/
#sec04{
	background-image: url(../images/bg.jpg);
	transform: skew(0deg, -18deg);
	padding-bottom: 90px;
}
#sec04 h2 {
	color: #fff;
}
#sec04 .img01 {
	position: relative;
}
#sec04 .img01 #box {
	float: left;
    width: 45%;
    height: 250px;
}
#sec04 .img01 .title {
	font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
	font-weight: bold;
	color: #ff00ae;
	padding-top: 90px;
	z-index: 3;
}
#sec04 .img01 p {
	padding: 20px 3% 40px;
	z-index: 3;
}
#sec04 .img01 img {
	position: absolute;
	top: 0;
	z-index: -1;
}


/* SEC05 成功をつかむチャンス
------------------------------------------------------------*/
#sec05{
}


.sec_05_02 {
	background-color: #ea4033;
	color: #fff;
	padding: 0% 5%;
}
.sec_05_02 p{
	text-align: center;
	line-height: 1.2;
	font-size: 24px;
}
.sec_05_02 .big {
	font-size: 30px;
}
.sec_05_02 img {
	padding: 0.5rem 0;
}

.sec_05_03 {
	background-color: #61cab3;
	color: #fff;
	padding: 0% 2%;
}
.sec_05_03 img {
	margin-bottom: -5px;
}

.sec_05_04 {
	background-color: #61cab3;
}
.sec_05_04 .inner {
	width: 96%;
	margin: 0 auto;
	background-image: url(../images/sec_05_04.png);
	background-repeat: no-repeat;
	background-position: center top;
    background-size: cover;
}
.sec_05_04 p{
	text-align: center;
	line-height: 1.2;
	font-size: 18px;
}
.sec_05_04 .text01{
	padding-top: 15%;
    color: #000;
    font-size: 30px;
    font-weight: bold;
}
.sec_05_04 .text02{
	padding: 30% 0% 10%;
	font-size: 18px;
	color: #fff;
}
.sec_05_04 .big {
	font-size: 24px;
	color: #ff0;
}
.sec_05_04 img {
	padding: 0.5rem 0;
}

.sec_05_05 {
}
.sec_05_05 img {
	margin-bottom: -6px;
}

.sec_05_06 {
	background-color: #61cab3;
	padding: 10% 3% 5%;
	text-align: center;
}
.sec_05_06_title {
	font-size: 24px;
	font-weight: bold;
	padding-bottom: 5%;
}
.sec_05_06 p {
	line-height: 2;
	font-weight: bolder;
}
.sec_05_06 p span {
	background-color: #FBD632;
    padding: 1%;
	font-size: 24px;
	font-weight: bold;
}


.sec_05_01 {
	background-color: #61cab3;
	padding: 0 5% 10%;
 font-family: 'M PLUS 1p', sans-serif;transform: rotate(0.03deg);
 font-weight: 700
}
.sec_05_01_title {
}
.sec_05_01 p{
	line-height: 1.5;
}
.sec_05_01 img {
	
}
.sec_05_01 #arrow {
	text-align: center;
	font-size: 36px;
	margin: -10px 0 0;
}


/* SEC06 募集要項
------------------------------------------------------------*/
#sec06{
	position: relative;
	font-weight: bold;
	padding-bottom: 20px;
}
#sec06 h2 {
	padding: 50px 0 0;
}


/* 見出しのデザイン */
.sec_06_title {
  padding: 0.4em 1.5em;/*文字の上下 左右の余白*/
  color: #494949;/*文字色*/
  background: #f4f4f4;/*背景色*/
  border-left: solid 5px #0a69b7;/*左線*/
  border-bottom: solid 3px #d7d7d7;/*下線*/
  margin: 50px 0 20px;
}


.sec_06_01 {
}
.sec_06_01 th, td {
	padding: 10px 0;
}



/*---- アコーディオン全体 ----*/

#sec06 .accordion {
	padding: 0px 0 50px;
}
#sec06 .accordion .accordion_title {
font-size: 24px;
padding: 10px;
text-align: center;display: flex; justify-content: center;
flex-direction: column;
}
#sec06 .accordion .accordion_title img {
	position: inherit;
	width: 64px;
    bottom: inherit;
	left: inherit;margin: 0 auto;
}
#sec06 .accordion h2 {
	text-align: left;
	font-size: 15px;
    padding: .6em 1.2em .6em 1.2rem;
    background: -webkit-linear-gradient(top, #69b4e6 0%, #3498db 100%);
    background: linear-gradient(to bottom, #69b4e6 0%, #3498db 100%);
    color: #fff;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .3);
    border-top: 3px solid #0a69b7;
	border-radius: 10px;
}
#sec06 .transition, p, ul li i:before, ul li i:after {
  transition: all 0.25s ease-in-out;
}
#sec06 .flipIn, h1, ul li {
  animation: flipdown 0.5s ease both;
}
#sec06 .no-select, h2 {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

#sec06 p {
  color: rgba(0, 0, 0, 0.8);
  font-size: 17px;
  line-height: 26px;
  letter-spacing: 1px;
  position: relative;
  overflow: hidden;
  max-height: 800px;
  opacity: 1;
  transform: translate(0, 0);
  margin-top: 14px;
  z-index: 2;
	padding: 0px 20px 10px;
}

#sec06 ul {
  list-style: none;
  perspective: 900;
  padding: 0;
  margin: 0;
}
#sec06 ul li {
  position: relative;
  padding: 0;
  margin: 0;
  /*padding-bottom: 4px;
  border-top: 1px solid #0a69b7;*/
}
#sec06 ul li:nth-of-type(1) {
  animation-delay: 0.5s;
}
#sec06 ul li:nth-of-type(2) {
  animation-delay: 0.75s;
}
#sec06 ul li:nth-of-type(3) {
  animation-delay: 1s;
}
#sec06 ul li:last-of-type {
  padding-bottom: 0;
}
#sec06 ul li i {
  position: absolute;
  transform: translate(-6px, 0);
  margin-top: 16px;
  right: 0;
}
#sec06 ul li i:before, ul li i:after {
  content: "";
  position: absolute;
  background-color: #fff;
  width: 3px;
  height: 9px;
  right: 10px;	
}
#sec06 ul li i:before {
  transform: translate(-2px, 0) rotate(45deg);
}
#sec06 ul li i:after {
  transform: translate(2px, 0) rotate(-45deg);
}
#sec06 ul li input[type=checkbox] {
  position: absolute;
  cursor: pointer;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
}
#sec06 ul li input[type=checkbox]:checked ~ p {
  margin-top: 0;
  max-height: 0;
  opacity: 0;
  transform: translate(0, 50%);
}
#sec06 ul li input[type=checkbox]:checked ~ i:before {
  transform: translate(2px, 0) rotate(45deg);
}
#sec06 ul li input[type=checkbox]:checked ~ i:after {
  transform: translate(-2px, 0) rotate(-45deg);
}

@keyframes flipdown {
  0% {
    opacity: 0;
    transform-origin: top center;
    transform: rotateX(-90deg);
  }
  5% {
    opacity: 1;
  }
  80% {
    transform: rotateX(8deg);
  }
  83% {
    transform: rotateX(6deg);
  }
  92% {
    transform: rotateX(-3deg);
  }
  100% {
    transform-origin: top center;
    transform: rotateX(0deg);
  }
}

/*------- contact tel line -------*/

.call {
    text-align: center;
    margin: 1rem auto 4rem;
}
@media only screen and (min-width: 641px){
.call {
    margin: 1rem auto 2rem;
	}}

.btn_contact a {
    color: #0a69b7;
    border: 2px solid #0a69b7;
    border-radius: 5px;
    position: relative;
    font-size: 1.5rem;
    font-weight: 600;
    display: inline-block;
    box-sizing: border-box;
    padding: 10px 50px 10px 30px;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    text-decoration: none;
}
.btn_contact a i {
    position: absolute;
    right: 25px;
    font-family: "Font Awesome 5 Free";
    font-size: 27px;
    top: 24%;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-property: transform;
    transition-property: transform;
}
.fa-arrow {
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
}
.fa-arrow:before {
    content: "\f35a";
}


.btn_phone a {
    color: #0a69b7;
    border: 2px solid #0a69b7;
    border-radius: 5px;
    position: relative;
    font-size: 1.5rem;
    font-weight: 600;
    display: inline-block;
    box-sizing: border-box;
    padding: 10px 70px 10px 60px;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    text-decoration: none;
}
.btn_phone a i {
    position: absolute;
    right: 25px;
    font-size: 30px;
    top: 17%;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-property: transform;
    transition-property: transform;
}

.btn_line a {
    color: #fff;
    background-color: #00b900;
    border: 2px solid #00B900;
    border-radius: 5px;
    position: relative;
    font-size: 1.5rem;
    font-weight: 600;
    display: inline-block;
    box-sizing: border-box;
    padding: 10px 68px 10px 54px;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    text-decoration: none;
}
.btn_line a i {
    position: absolute;
    right: 25px;
    font-size: 30px;
    top: 17%;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-property: transform;
    transition-property: transform;
}




/*---  footer img & coment ---*/

#sec06 img {
	position: absolute;
	bottom: 0px;
	width: 80%;
	z-index: 99;
	left:10%;
}

@media only screen and (min-width: 641px){
#sec06 img {
	bottom: 0px;
	width: 58%;
	left: 21%
	}
.sec_06 {
    width: 78%;
    height: 250px;
    margin: 0 0 30px 30%;
}}
.sec_06 {
	width: 78%;
	height: 200px;
	background-color: #0a69b7;
	margin: 0 0 30px 70px;
	z-index: 10;
}

.sec_06 .fade_r:first-of-type{
  margin: 6% 0% 0% 26%;
  padding: 0;
}
.sec_06 p {
	padding: 10px 10px 10px 80px;
	color: #fff;
}

.sec_06 .footer_logo {
	top: 0px !important;
	right: 0px !important;
	width: 62% !important;
	
}




/*------------- top戻る ---------------*/

.pagetop {
    display: none;
    position: fixed;
    bottom: 30px;
    right: 15px;
}
.pagetop a {
    display: block;
    background-color: #ccc;
    text-align: center;
    color: #222;
    font-size: 24px;
	border-radius: 3%;
    text-decoration: none;
    padding: 5px 13px;
	filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
}
.pagetop a:hover {
    display: block;
    background-color: #b2d1fb;
    text-align: center;
    color: #fff;
    font-size: 24px;
	border-radius: 3%;
    text-decoration: none;
    padding:5px 13px;
	filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
}


	
/*------------- nav menu -------------*/	
#mainnav.changeNav {
    background: rgba(10,105,183,.9);
}	
  a#menu{
  	display: inline-block;
  	position: relative;
  	width: 40px;
  	height: 40px;
  	margin: 10px;
	}

	#menuBtn{
  	display: block;
  	position: absolute;
  	top: 50%;
  	left: 30%;
  	width: 30px;
  	height: 2px;
  	margin: -1px 0 0 -7px;
  	background: #fff;
  	transition: .2s;
	}

	#menuBtn:before, #menuBtn:after{
  	display: block;
  	content: "";
  	position: absolute;
  	top: 50%;
  	left: 0;
  	width: 30px;
  	height: 2px;
  	background: #fff;
  	transition: .3s;
	}

	#menuBtn:before{
  	margin-top: -7px;
	}

	#menuBtn:after{
  	margin-top: 5px;
	}

	a#menu .close{
  	background: transparent;
	}

	a#menu .close:before, a#menu .close:after{
  	margin-top: 0;
	}

	a#menu .close:before{
  	transform: rotate(-45deg);
  	-webkit-transform: rotate(-45deg);
	}

	a#menu .close:after{
  	transform: rotate(-135deg);
  	-webkit-transform: rotate(-135deg);
	}

	.panel{
		width: 100%;
  max-width: 750px;
		display: none;
		overflow: hidden;
		position: fixed;
/*		left: 0;*/
		z-index: 100;
	}
    #mainnav {
    position: fixed;
    top: 0;
    width: 100%;
    text-align: right;
    z-index: 500;
    }
@media only screen and (min-width: 749px){
	#mainnav{
		position: fixed;
		top: 0;
		width: 750px;
		text-align: right;
		z-index:500;
	}}

	#mainnav ul{
		border-bottom: 1px solid #ccc;
		background: #fff;
		text-align: left;
	}

	#mainnav li a{
		position: relative;
		display:block;
		padding:15px 25px;
		border-bottom: 1px solid #ccc;
		color: #000;
		font-weight: 400;
	}

	#mainnav li a:before{
		display: block;
		content: "";
		position: absolute;
		top: 50%;
		left: 5px;
		width: 6px;
		height: 6px;
		margin: -4px 0 0 0;
		border-top: solid 2px #000;
		border-right: solid 2px #000;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	
	

/*アニメーション*/
/* 左から */

.fadeLeft{
animation-name:fadeLeftAnime;
animation-duration:1s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeLeftAnime{
  from {
    opacity: 0;
	transform: translateX(-100px);
  }

  to {
    opacity: 1;
	transform: translateX(0);
  }
}

/* 右から */

.fadeRight{
animation-name:fadeRightAnime;
animation-duration:1s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeRightAnime{
  from {
    opacity: 0;
	transform: translateX(100px);
  }

  to {
    opacity: 1;
	transform: translateX(0);
  }
}

/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
 
.fadeLeftTrigger,
.fadeRightTrigger{
    opacity: 0;
}


/*お問合せ*/
section h3{
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	padding: 0 0 30px;
}
form {
  margin-bottom: 4em;
  text-align: center;
 
}
@media only screen and (min-width: 641px){
form {
  margin-bottom: 8em;
  text-align: center;
 
}
}
input{ box-sizing: border-box;    border-width: 1px!important;}
.table-form { box-sizing: border-box;
  width: 100%;
  border-collapse: collapse;
  font-size: 16px;
  margin-bottom: 15px
}
.table-form th, .table-form td {
  display: block;
  width: 100%;
  text-align: left;
}
.table-form td {
  padding: 10px 0!important;
}
.table-form th {
  vertical-align: middle;
  position: relative;
  font-weight: 500
}
.table-form .flex-item{display: flex;flex-direction:column;}
input[type="text"], textarea {
  background: #fff;
  display: block;
  font-size: 14px;
  padding: 12px 15px;
  width: 100%;
  transition: 0.8s;
  border-radius: 0;
  color: #333; box-sizing: border-box;
}
input[type="text"]:focus, textarea:focus {
  background: #e9f5fb;
}
textarea[name="content"] {
  display: inline-block;
  width: 100%;
  height: 200px; 
}
input::placeholder, textarea::placeholder {
  color: #ccc;
}
::-webkit-input-placeholder {
  color: #ccc;
  opacity: 1;
}
::-moz-placeholder {
  color: #ccc;
  opacity: 1;
}
:-ms-input-placeholder {
  color: #ccc;
  opacity: 1;
}
.select_day input::placeholder {
  color: black!important;
}
.select_day input:-ms-input-placeholder {
  color: black!important;
}
.select_day input::-ms-input-placeholder {
  color: black!important;
}
.requied {
  color: #FFF;
  font-size: 14px;
  display: inline-block;
  padding: 0.1em 0.3em 0.1em;
  background: #EE5D49;
  position: absolute;
  right: 0px
}
input[type=date] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: block;
  width: 100%;
  height: 45px;
  padding: 5px 10px;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  color: #333;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #818181;
}
.select_time select {
  background: url(assets/img/icon_arrow_down@2x.png) no-repeat right 17px center;
  -webkit-appearance: none;
  word-wrap: normal;
  position: relative;
  display: block;
  width: 100%;
  height: 45px;
  padding: 5px 10px;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  color: #333;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #818181;
}
.select_day {
  width: 100%;
  margin-bottom: 15px;color: #333;
}
.select_time {
  overflow: hidden;
  width: 100%;
}
/*---------------datepicker*/
.ui-datepicker-calendar .day-sunday > a,
.ui-datepicker-calendar .day-holiday > a {
  background: #ffc0c0;
}
.ui-datepicker-calendar .day-saturday > a {
  background: #c0d0ff;
}

@media screen and (min-width: 768px) {
.table-form .flex-item{display: flex;flex-direction:row;justify-content: space-between;}
  .table-form {
    border-bottom: 1px solid #0a69b7;
  }
  .table-form th {
    padding: 20px;
    display: table-cell;
    width: 40%;
    text-align: left;
    position: relative;
    border-top: 1px solid #0a69b7;
    border-left: 1px solid #0a69b7;
    border-right: 1px solid #0a69b7;
  }
  .table-form td {
    padding: 20px!important;
    display: table-cell;
    border-top: 1px solid #0a69b7;
    border-left: 1px solid #0a69b7;
    border-right: 1px solid #0a69b7;
  }
  
  .requied {
    right: 20px
  }
  .select_day {
    width: calc(50% - 10px)!important;
    margin-bottom: 0
  }
  .select_time {
    width: calc(50% - 10px)!important
  }
}


.flex-item {
  display: flex;
  flex-direction: column;
  margin-bottom: 65px;
  text-align: left;
}
.flex-item:last-child {
  margin-bottom: 0px!important;
}



input.btn {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.5;
    position: relative;
    display: inline-block;
    padding: 1rem 4rem;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    text-align: center;
    vertical-align: middle;
    text-decoration: none;
    letter-spacing: 0.1em;
    color: #fff;
    background: #0a69b7;;
}
input.btn{border: 2px solid #0a69b7;; }
input.btn:hover{color: #0a69b7;;background: #fff;}
input.btn.grey_btn{background: #666;border: 2px solid #0a69b7;; }
input.btn.grey_btn:hover{color: #0a69b7;;
background: #000;}