@charset "utf-8";
/* CSS Document */

* {
	margin: 0;
	padding: 0;
}
html {
	line-height: 1.4;
}
body {
	font-size: 24px;
	background-color: #ebe3d6;
	color:#333333;
	min-width:1200px;
	line-height: 2.2;
font-family: "Arial", "メイリオ";
}

a {
  color: #000000;
  text-decoration: none;
}
a:hover{
  color: #333333;
  text-decoration: none;
}

p
{
margin: 0 auto;
padding: 0;
}


@media screen and (max-width: 979px) {
body {

	font-size: 16px;
	line-height: 1.8
}

}


img {
	vertical-align: bottom;
}
.pc {
	display: block;
}
.sp {
	display: none;
}

h1,h2,h3{
	display: block;
}


.wrapper {
	padding:0 0;
	margin: 0 auto;
	width: 100%;
	text-align: center;
}


@media screen and (max-width: 979px) {
.pc {
	display: none;
}
.sp {
	display: block;
}

.wrapper {
	padding:0;
	margin: 40px auto 0;
	width: 100%;
	text-align: center;

}

}


.txt_b{
font-weight: bold;
}

.txt_big{
font-size: 160%;
font-weight: bold;
}

.txt_red{
font-weight: bold;
color: #e71717;
}

.txt_w{
color: #ffffff;
}

.txt_s{
font-size:70%;
text-align: right;
padding:0 0;
line-height: 1;
}

.txt_tell{
font-size:28px;
font-weight: bold;
}



.logo{
    text-align: center;
    margin:0 auto ;
	padding: 20px 0;
}

/* ==========================================================================
   追撃ボタン
   ========================================================================== */
.fixed_btn
{
  position: fixed;
  top: 0; 
  right: 0;
  padding: 0;
  z-index: 99999;
}


@media screen and (max-width: 959px) { 
    /*　画面サイズが959px以下はここを読み込む　*/

#sp-fixed-menu{
   position: fixed;
   width: 100%;
   bottom: 0px;
   font-size: 0;
   opacity: 0.9;
   z-index: 99;
}

/*メニューを横並びにする*/
#sp-fixed-menu ul{
   display: flex;
   list-style: none;
   padding:0;
   margin:0;
   width:100%;
}

#sp-fixed-menu li{
   justify-content: center;
   align-items: center;
   width: 50%;
   padding:0;
   margin:0;

}
}


/* #################################  共通*/
/* #################################  共通*/

.box{
width: 1000px;
margin: 0 auto 0;
padding:100px 0 0 0;
}

.box_left{
width: 100%;
background: url("../img/bg_top.png") top left no-repeat;
}

.box_right{
background: url("../img/bg_bottom.png") top right no-repeat;
}

.box00{
width: 1000px;
margin: 0 auto 0;
padding:0 0;
}


.box_in{
margin: 0 auto 0;
padding:0 0;
}


.row{
width: 100%;
display: flex;
margin: 0 auto 0;
padding:0 0;
 justify-content: space-between;

    
}

.col{
width: 50%;
margin: 0 auto;
text-align: center;
padding: 0;
}


.img-shadow{
position: absolute;
padding-top:0; 
background-color:#ae1b4e;
}


.img-shadow img {
    position: relative;
    top: -15px;
    left: -15px;
}


.title{

font-size: 60px;
font-weight: bold;
margin: 0 auto;
line-height: 1.4;
text-align: center;
font-weight:bold;
font-family: 'Noto Sans JP', sans-serif;
letter-spacing: 0.12em;

  position: relative;
  display: inline-block;
  margin-bottom: 1em;
}

.title:before {
  content: '';
  position: absolute;
  bottom: -30px;
  display: inline-block;
  width: 400px;
  height: 4px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: #ae1b4e;
  border-radius: 2px;
}

.title02{

font-size: 60px;
font-weight: bold;
margin: 0 auto;
line-height: 1.4;
text-align: center;
font-weight:bold;
font-family: 'Noto Sans JP', sans-serif;
letter-spacing: 0.12em;
color: #ffffff;
}


.title_b{
display:inline-block;
font-size: 60px;
font-weight: bold;
margin: 0 auto;
line-height: 1.6;
text-align: center;
color: #ae1b4e;
}

.title_sbu{
margin: 0 auto 30px;
font-size: 30px;
display:inline-block;
background-color: #ae1b4e;
border-radius: 50px;
color: #ffffff;
padding: 0 100px 0 100px;
letter-spacing: 1.2em;
}

.title_sbu_s{
margin: 0 auto 0;
display:inline-block;
color: #ae1b4e;
padding: 20px 0 0 0;
letter-spacing: 0.6em;
}



@media screen and (max-width: 979px) {
.box{
width: 100%;
margin: 0 auto 0;
padding:0 0;
}

.box00{
width: 100%;
margin: 0 auto 0;
padding:0 0;
}


.box_02{
width: 100%;
margin: 0 auto 0;
padding:0 0;

}
.box_03{
width: 100%;
margin: 0 auto 0;
padding:10px 0;
}

.box_in{
margin: 0 auto 0;
padding:0 0;
}

.row{
width: 100%;
display: flex;
margin: 0 auto 0;
padding:0 0;
justify-content: space-around;
flex-wrap: wrap;
}

.col{
width: 100%;
margin: 0 auto;
text-align: center;
padding: 0;
  display:flex; /* ここは子要素divの上下左右を決めるための指定*/
  justify-content: space-around; /* 水平方向の指定*/
  flex-wrap: wrap;
}

.col img{
width: 100%;

}

.img-shadow{
width: 70%;
margin: 20px auto;
position:static;
padding-top:0; 
background-color:#ae1b4e;
}


.img-shadow img {
    position: relative;
    top: -10px;
    left: -10px;
}


.title{
font-size: 160%;
}

.title:before {
  content: '';
  position: absolute;
  bottom: -15px;
  display: inline-block;
  width: 40%;
  height: 4px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: #ae1b4e;
  border-radius: 2px;
}

.title_b{
display:inline-block;
font-size: 200%;
font-weight: bold;
margin: 0 auto;
line-height: 1.6;
text-align: center;
color: #ae1b4e;
font-weight: bold;
}

.title_sbu{
margin: 0 auto 10px;
font-size: 120%;
display:inline-block;
background-color: #ae1b4e;
border-radius: 50px;
color: #ffffff;
padding: 0 20px 0 20px;
letter-spacing: 0.2em;
}

.title_sbu_s{
margin: 0 auto 0;
display:inline-block;
color: #ae1b4e;
padding: 20px 0 0 0;
letter-spacing: 0.2em;
}

}

.more {
width: 100%;
margin: 0 auto;
}

.more a {
display: block;
margin: 80px auto;
color: #ae1b4e;
font-weight: bold;
background: #fffff;
border:#ae1b4e 5px solid;
padding:5px 30px;
transition: .3s;
width:600px;
text-decoration: none;
text-align: center;
box-shadow: 10px 10px 0px 0 rgb(19, 164, 195);
font-size: 30px;
}

.more a:hover {
  background: #fef3c8;
}

@media screen and (max-width: 979px) {
.more a {
display: block;
margin: 20px auto;
color: #ae1b4e;
font-weight: bold;
background: #ffffff;
border:#ae1b4e 3px solid;
padding:5px 30px;
transition: .3s;
width:90%;
text-decoration: none;
text-align: center;
}

.more a:hover {
  background: #fef3c8;
}

}


/* #################################  TOP*/
/* #################################  TOP*/

nav{

}
.top{
width: 100%;
height:90vh;
background: url("../img/top_bg.png") top center / cover no-repeat;
position:relative;
}

header  {
top: 0;
z-index: 2;
width: 100%;
transition: .3s;
padding: 20px 0;
background: url("../img/bg_top.png") top left no-repeat;
}



.top_navi{
width: 1000px;
display: flex;
flex-wrap: wrap;
margin: 0 auto;
justify-content: space-between;
}

/* #################################  TOP ナビ　追撃*/
.is-fixed  {
  position:  fixed;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  background-color: rgba(255,255,255,1.0);
  -webkit-transition: all .4s ease 0s,background .6s ease .2s;
  transition: all .4s ease 0s,background .6s ease .2s;
  -webkit-overflow-scrolling: touch;
  overflow-scrolling: touch;
  padding: 15px 0;
}

.top_logo{
width: 40%;
text-align: left;
padding: 0 20px 0 0;
}

.top_logo img{
width:100%;
text-align: left;
padding: 0;
}

.top_logo p{
font-size: 14px;
}


.top_menu{
width: 48%;
text-align: left;
line-height: 1.2;
}

.top_menu_in{
width: 100%;
margin: 0 auto;
font-size: 18px;
}

.top_menu_in ul{
display: flex;
list-style-type: none;
margin: 0 auto;
padding: 10px 0 0 0; 
justify-content: space-between;
flex-wrap: wrap;
}

.top_menu_in li{
padding:0 ;
justify-content: flex-end;
}

.top_menu_in li a{
color: #333333;
}

.top_menu_in li a:hover{
color: #ae1b4e;
}

.top_inp a  {
display: block;
margin: 10px 0 0 0;
color: #ffffff;
background: #ae1b4e;
padding:2px 15px;
border-radius: 10px;
transition: .3s;
text-decoration: none;
text-align: center;
line-height: 2;
font-size: 90%;
}

.top_inp a:hover {
  background: #ffffff;
 color: #ae1b4e; 
 border:2px solid #ae1b4e;
}

.top_inp i  {
padding: 0 5px 0 5px;
font-size: 105%;
}


.top_main{
  position:absolute;
  top:45%;
  left:50%;
  transform:translate(-50%,-50%);
  width:100%;
  text-align: center;

}

.top_main_bar{
background-color: rgba(0, 0, 0, 0.8);
margin: 0 auto 20px;
padding: 10px 0;
text-align: center;
width: 800px;
color: #ffffff;
line-height:1.2;
font-size: 30px;
font-weight: bold;
font-family: 'Noto Sans JP', sans-serif;
letter-spacing: 0.12em;
}

.top_main p{
color: #ffffff;
}



/* #################################  TOP SP*/
/* #################################  TOP SP*/

@media screen and (max-width: 979px) {
header  {
  position: fixed;
top: 0;
  z-index: 2;
  width: 100%;
  transition: .3s;
  background-color:#ebe3d6;
  padding:5px 0 10px 0;
}

.header_in  {
width: 90%;
margin: 0 auto;
text-align: center;
padding: 0 0;
}
.header_in img {
width: 40%;
}

.top{
  width: 100%;
  height:90vh;
  background: url("../img/top_bg_sp.png") top center / cover no-repeat;
position:relative;
}


.top_main{
  position:absolute;
  top:55%;
  left:50%;
  transform:translate(-50%,-50%);
  width:100%;
  text-align: center;
  font-size: 180%;
}

.top_main img{
  width:50%;
}

.top_main_bar{
background-color: rgba(0, 0, 0, 0.8);
margin: 0 auto 20px;
padding: 10px 0;
text-align: center;
color: #ffffff;
line-height:1.2;
width: 80%;
font-size: 90%;
}

/* ==========================================================================
   スマホメニュー
   ========================================================================== */

#nav-drawer {
position: fixed;
z-index: 9999;
margin: 0;
padding: 5px 10px 5px 10px;
border: 0;
outline: 0;
right: 0;

}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#nav-open {
  display: inline-block;
  width: 30px;
  height: 22px;
  vertical-align: middle;
  padding: 3px 0 0 0;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 3px;/*線の太さ*/
  width: 30px;/*長さ*/
  border-radius: 3px;
  background: #ae1b4e;

  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;
  right: 0;
  z-index: 9999;/*最前面に*/
  width: 90%;/*右側に隙間を作る（閉じるカバーを表示）*/
  max-width: 330px;/*最大幅（調整してください）*/
  height: 100%;
  background: #ffffff;/*背景色*/
  transition: .3s ease-in-out;/*滑らかに表示*/
  -webkit-transform: translateX(105%);
  transform: translateX(105%);/*左に隠しておく*/
}

/*チェックが入ったらもろもろ表示*/
#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);
}


#ci .drawer-menu li {
    border: solid #0091d6 1px;
    border-width: 1px 0 0;
}

.menu li {
    border: solid #666666 1px;
    border-width: 1px 0 0;
	padding: 10px;
	text-align: center;
	line-height: 2;
}

.menu p {

	padding: 10px;

}
.top_inp a  {
display: block;
margin: 10px auto;
color: #ffffff;
background: #ae1b4e;
padding:0 15px;
border-radius: 50px;
transition: .3s;
text-decoration: none;
text-align: center;
font-weight: bold;
line-height: 2;
width: 90%;
}

.top_inp a:hover {
color: #ae1b4e;
}

.top_inp i  {
padding: 0 5px 0 5px;
font-size: 105%;
}
.top_main p{
font-size: 70%;
}

}

/* #################################  プレミアム*/
/* #################################  プレミアム*/


.pre_box{
display: flex;
flex-wrap: wrap;
margin: 100px auto 40px;
max-width:  100%;
padding: 20px 0 0 0;
background: url("../img/pre_box_bg.png") top center no-repeat;
height: 628px;
}


.pre_box p{
text-align: left;
margin: 0 auto;
padding: 100px 50px 0 80px;
line-height: 1.8;
}

@media screen and (max-width: 979px) {
.pre_box{
display: flex;
flex-wrap: wrap;
margin: 0 auto 40px;
max-width:  100%;
padding: 20px 0 0 0;
background: url("../img/pre_box_bg.png") top center no-repeat;
background-size:cover;
height: auto;
}


.pre_box p{
text-align: left;
margin: 0 auto;
padding: 20px 25% 10px 20px;
line-height: 1.8;
}


.pre_box img{
width: 75%;
padding: 0 0 20px 0;
}

}

/* #################################  MENU*/
/* #################################  MENU*/

.menu_box{
margin: 50px auto;
}



.menu_title{
background-color: #333333;
color: #ebe3d6;
font-size: 18px;
font-weight: bold;
margin: 20px auto 20px;
}

.menu_img{
width: 100%;
}

.menu_p{
text-align: left;
padding:20px 0 0 0;
font-size: 16px;
line-height: 1.4;
}

.menu_p_right{
text-align: right;
padding: 0;
font-weight: bold;
font-size: 16px;
}

.menu_box_w{
background-color: #ffffff;
}


.menu_box_w p{
text-align: left;
padding:40px;
line-height: 1.8;
}

@media screen and (max-width: 979px) {
.menu_box{
margin: 20px auto;
width: 98%;
}

.menu_title{
background-color: #333333;
color: #ebe3d6;
font-size: 13px;
font-weight: bold;
margin: 10px auto 10px;
}

.menu_p{
text-align: left;
padding:20px 0 0 0;
font-size: 13px;
line-height: 1.4;
}

.menu_p_right{
text-align: right;
padding: 0;
font-weight: bold;
font-size: 14px;
}

.menu_box_w{
background-color: #ffffff;
}


.menu_box_w p{
text-align: left;
padding:10px;
line-height: 1.8;
font-size: 14px;
}
}

/* #################################  ガイド*/
/* #################################  ガイド*/
.guide{
background: url("../img/guide_bg.png") top center no-repeat;
background-size:cover;
background-color: #ae1b4e;
padding: 100px 0;
}

.guide_box{
display: block;
margin: 80px auto;
padding:30px 30px;
background-color: #ffffff;
}

.guide_title{
display: block;
padding:0 0 20px 0;
border-bottom: 3px solid #ae1b4e;
text-align: left;
font-weight: bold;
}

.guide_txt{
display: block;
padding: 20px 0 0 0;
text-align: left;
line-height: 1.6;

}

.guide_relative {
    position: relative;
}
.guide_absolute {
    position: absolute;
	top:-80px;
	left: 20px;
}

.guide_tell {
background-color: #ebe3d6;
padding: 10px ;
line-height: 1.6;
}

.guide_mail {
background-color: #e6ac21;
padding: 20px;
line-height: 2.2;
color: #ffffff;
border-radius: 20px;

}


@media screen and (max-width: 979px) {
.guide{
background: url("../img/guide_bg.png") top center no-repeat;
background-size:cover;
background-color: #ae1b4e;
padding: 20px 0;
}

.guide_box{
display: block;
margin: 20px auto;
padding:10px;
background-color: #ffffff;
width: 90%;
}

.guide_title{
display: block;
padding:10px 0;
border-bottom: 3px solid #ae1b4e;
text-align: left;
font-weight: bold;
margin: 0 0 0 10px;
}

.guide_txt{
display: block;
padding: 10px 0 5px 10px;
text-align: left;
line-height: 1.6;
font-size: 90%;
}

.guide_relative {
    position: relative;
}
.guide_absolute {
    position: absolute;
	top:0%;
	left:0;
}

.guide_tell {
margin: 0 auto;
width: 100%;
background-color: #ebe3d6;
padding: 10px ;
line-height: 1.6;
border-radius: 20px;
}

.guide_mail {
margin: 5px auto;
width: 100%;
background-color: #e6ac21;
padding: 10px;
line-height: 2.2;
color: #ffffff;
border-radius: 20px;

}
}
/* #################################  FAQ*/
/* #################################  会社概要*/
/*------------------------------

ここからアコーディオンのCSS

------------------------------*/


.faq {
width: 90%;
margin: 20px auto;
}

/* チェックボックスは非表示 */
.accordion-hidden{
  display: none;
}

/* Question部分 */
.accordion-open {
  display: block;
  padding: 10px 10px 10px 20px;
  background: #ae1b4e;
  cursor: pointer;
  margin: 5px 0;
  font-weight: 700;
  position: relative;/* 変更部分 */
  color: #ffffff;
  text-align: left;
}

/* 開閉状態を示すアイコン+の作成 */
.accordion-open::before,
.accordion-open::after {
  content: '';
  width: 20px;
  height: 3px;
  background: #ffffff;
  position: absolute;
  top: 50%;
  right: 5%;
  transform: translateY(-50%);
}

/* 一本は縦にして+を作る */
.accordion-open::after {
  transform: translateY(-50%) rotate(90deg);
  transition: .5s;
}

/* アコーディオンが開いたら縦棒を横棒にして-にする */
.accordion-hidden:checked + .accordion-open:after {
  transform: translateY(-50%) rotate(0);
}

/* Answer部分 */
.accordion-close {
  display: block;
  height: 0;
  overflow: hidden;
  padding: 0;
  opacity: 0;
  transition: 0.5s;/* 表示速度の設定 */
}

/* チェックボックスにチェックが入ったらAnswer部分を表示する */
.accordion-hidden:checked + .accordion-open + .accordion-close {
  height: auto;
  opacity: 1;
  padding: 10px;
text-align: left;
line-height: 1.6;
  
}


.circle {
  background: #ffffff;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  color: #ae1b4e;
  font-size: 40px;
  text-align: center;
  line-height: 50px;
  margin: 0 auto;
}


/* #################################  会社概要*/
/* #################################  会社概要*/

.comp{
margin: 40px auto 0;
padding:100px 0 50px 0;
background-color: #f3f3f2;

}

.comp_box{
margin: 40px auto 0;
padding:100px 0 50px 0;
width: 1000px;

}

/* ############  テーブルCSS*/
.list_table,
.list_table > dt,
.list_table > dd {
    box-sizing: border-box;
	line-height: 1.6;
}

.list_table > dt,
.list_table > dd {
    padding: 1em;
    margin: 0px;
}

.list_table > dt {
    background-color: #ae1b4e;
    color: #fff;
}

.list_table > dd {
    background-color: #fff;
	text-align: left;

}
    .list_table {
        display: flex;
        flex-wrap: wrap;
        border-bottom: 1px solid #f3f3f2;
    }
    .list_table > dt,
    .list_table > dd {
        display: flex;
        flex-direction: column;
        justify-content: center;
        border-top: 1px solid #f3f3f2;
		
    }
    .list_table > dt {
        width: 30%;
    }
    .list_table > dd {
        width: 70%;
        border-right: 1px solid #f3f3f2;
		padding: 20px 40px 20px 40px;

    }


@media screen and (max-width: 979px) {
.comp{
margin: 40px auto 0;
padding:40px 0 20px 0;
background-color: #f3f3f2;

}

.comp_box{
margin: 0 auto 0;
padding:20px 0 20px 0;
width: 90%;

}


.list_table{

        border-left: 1px solid #ddd;
		
    }
 
 .list_table > dt,
    .list_table > dd {
        display: flex;
        flex-direction: column;
        justify-content: center;
        border-top: 1px solid #ddd;
		
    }
    .list_table > dt {
        width: 100%;
    }
    .list_table > dd {
        width: 100%;
        border-right: 1px solid #ddd;

    }


}


/* ############   地図*/

.google-maps {
position: relative;
padding-bottom: 30%; // これが縦横比
height: 0;
overflow: hidden;
}

.google-maps iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
padding: 0 0 80px 0;
}


@media screen and (max-width: 979px) {

.google-maps {
position: relative;
padding-bottom: 40%; // これが縦横比
height: 0;
overflow: hidden;

}
.google-maps iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
padding: 0 0 20px 0;
}

}





/* #################################  お問い合わせ*/
/* #################################  お問い合わせ*/

.inq {
width: 1000px;
margin: 50px auto;
}

.inq_box {
display: flex;
border-bottom: 1px solid #caccd7;
width: 1000px;
margin: 50px auto;
flex-wrap: wrap;
}

.inq_box_title {
width: 30%;

padding:20px  10px;
text-align: center;

}

.inq_box_txt {
width: 70%;
padding:20px  50px;
background-color: #ffffff;
text-align: left;
}

.text1{
    width: 100%; /*親要素いっぱい広げる*/
    padding: 10px 15px; /*ボックスを大きくする*/
    font-size: 16px;
    border-radius: 3px; /*ボックス角の丸み*/
    border: 2px solid #ddd; /*枠線*/
    box-sizing: border-box; /*横幅の解釈をpadding, borderまでとする*/
}

@media screen and (max-width: 979px) {
.inq {
width: 100%;
margin: 20px auto;
}

.inq p{
width: 90%;
margin: 20px auto;
text-align: left;
}

.inq_box {
display: flex;
border-bottom: 1px solid #caccd7;
width: 90%;
margin: 10px auto;
}

.inq_box_title {
width: 100%;
padding:0 10px;
text-align: left;

}

.inq_box_txt {
width: 100%;
padding:0 0 10px 0 ;
background-color: #ffffff;
text-align: left;
}

.text1{
    width: 100%; /*親要素いっぱい広げる*/
    padding: 10px 15px; /*ボックスを大きくする*/
    font-size: 16px;
    border-radius: 3px; /*ボックス角の丸み*/
    border: 1px solid #ddd; /*枠線*/
    box-sizing: border-box; /*横幅の解釈をpadding, borderまでとする*/
}padding:20px 0;
background-color: #f2f3f5;
}







/* #################################  トップに戻る*/
/* #################################  アコーディオン全体*/

#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 100%;
}
 
#page-top a {
    display: block;
    background: #ae1b4e;
    color: #fff;
    width: 50px;
    padding: 0 0;
    text-align: center;
    text-decoration: none;
    border-radius: 10px;
}
 
#page-top a:hover {
    background: #fa9999;
    text-decoration: none;
}

@media screen and (max-width: 979px) {

#page-top {

    font-size: 140%;
}

}

/* #################################  フッター*/
/* #################################  アコーディオン全体*/

.footer {
width: 100%;
margin: 100px auto 20px;
padding: 50px 0;
text-align: center;
font-size: 80%;
border-top: 1px #333333 solid;
}

@media screen and (max-width: 979px) {
.footer {
width: 100%;
margin: 40px auto 20px;
padding: 20px 0;
text-align: center;
font-size: 80%;
}
}





.youtube {
margin:100px auto 40px;
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  max-width: 1260px;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

@media screen and (max-width: 979px) {
.youtube {
margin:20px auto 20px;
  position: relative;
  width: 90%;
  padding-top: 56.25%;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}
}

@media screen and (max-width: 979px) {
body {

    min-width: 100%;
}
.max_w {
	max-width: 100%;

}

.max_w90 {
	max-width: 90%;

}

.max_w50 {
	max-width: 40%;

}

.max_w80 {
	max-width: 80%;

}

}


.txt_left{
text-align: left;

}


/*------------------------------------------
新flex
------------------------------------------*/


.flex{
display: -webkit-flex; /* safari */
display: -moz-flex;
display: -ms-flex; /* IE10用 */
display: -o-flex;
-webkit-justify-content: space-between;
justify-content: space-between;
-ms-flex-pack: justify; /* IE10用 */
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-ms-flex-wrap: wrap; /* IE10用 */
-webkit-align-items: top; /* 縦方向中央揃え（Safari用） */
display: flex;
align-items: top; /* 縦方向中央揃え */
/*align-items: start;*/
}

.flex_start{
display: -webkit-flex; /* safari */
display: -moz-flex;
display: -ms-flex; /* IE10用 */
display: -o-flex;
-webkit-justify-content:start;
justify-content: start;
-ms-flex-pack: justify; /* IE10用 */
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-ms-flex-wrap: wrap; /* IE10用 */
-webkit-align-items: top; /* 縦方向中央揃え（Safari用） */
display: flex;
align-items: top; /* 縦方向中央揃え */
/*align-items: start;*/

}

.flex_center{
display: -webkit-flex; /* safari */
display: -moz-flex;
display: -ms-flex; /* IE10用 */
display: -o-flex;
-webkit-justify-content:center;
justify-content: center;
-ms-flex-pack: center; /* IE10用 */
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-ms-flex-wrap: wrap; /* IE10用 */
-webkit-align-items: top; /* 縦方向中央揃え（Safari用） */
display: flex;
align-items: top; /* 縦方向中央揃え */
/*align-items: start;*/
}
.flex90{width: 90%;padding:0 3%;margin: auto;text-align: left;}
.flex80{width: 80%;padding:0 3%;margin: auto;text-align: center;}
.flex50{width: 50%;padding: 3%;margin: auto;text-align: center;}
.flex60{width: 57%;padding: 0%;}
.flex40{width: 37%;padding: 0%;}
.flex33{width: 33%;padding:0 1%;text-align: center;}
.flex25{width: 25%;padding: 0%;}
.flex23{width: 23%;padding:2% 0% 5% 0%;}
.flex20{width: 20%;padding: 0%;}
.flex10{width: 8%;padding: 0%;}
.img_max{max-width: 100%;height: auto;}
.flex .inner{padding:0 1%;}


@media screen and (max-width: 979px) {
.flex90{width: 76%;padding:0 10% 0 0%;}
.flex80{width: 80%;padding: 0%;}
.flex30{width: 50%;padding: 1%;margin: 0 auto;}
.flex50{width: 100%;padding: 1%;margin: 0 auto;}
.flex60{width: 50%;padding: 0%;}
.flex40{width: 50%;padding: 0%;}
.flex33{width: 50%;padding:0 2%;text-align: center;}
.img_max{width: 100%;height: auto;}
.flex20{width: 20%;padding: 0%;}
.flex23{width: 50%;padding:2% 1% 5% 1%;}
.flex10{width: 20%;padding:2% 1% 5% 1%;}
}