@charset "UTF-8";
/* CSS Document */
/*--------------------
01.共通
02.メインビジュアル
03.マワリとは
04.こんな方におすすめ
05.マワリの強み
06.ボタンエリア
07.サポート
08.サポーター
09.プラン
10.ボタン２
11.収支について
12.開業の流れ
13.オーナーの声
14.ボタン３
15.モーダルウィンドゥ
16.フッター
--------------------*/

@media only screen and (max-width:768px){
/*----------
01.共通
----------*/
  .sp{
    display: block;
  }
  .pc{
    display: none;
  }
  
/*----------
02.メインビジュアル
----------*/
  .main_area{
    background: url("../img/main_bg.png") no-repeat center/cover;
    width: 100%;
    padding: 25px 0 83px;
  }
  .main_ttl_area{
    max-width: 331px;
  }
  .main_area .fukidashi{
    top: 90px;
    left: 0;
    width: 84.77px;
  }
  .main_area .flowing_tx{
    -webkit-transform: skew(0deg, 0deg);
    transform: skew(0deg, 0deg);
    margin-top: 23px;
    font-size: 33px;
    font-weight: 600;
    line-height: 1.7;
    letter-spacing: 0.02em;
  }
  .main_area .flowing_tx span{
  height: 65.06px;
  background-size: auto 65.06px;
}
  .main_area .logo{
    min-width: 0;
    max-width: 332px;
    margin: -450px auto 0 auto;
  }
  .main_area .flex{
    display: inline-block;
    padding-top: 250px;
    text-align: center;
  }
  .main_area .flex span{
    display: inline-block;
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 600;
    font-size: 18px;
    line-height: 1.7;
    letter-spacing: -0.02em;
  }
  .main_area .flex p:nth-child(1){
    margin-bottom: 25px;
  }
  
/*----------
03.マワリとは
----------*/
  .sec_about{
    padding: 96px 0 78px;
  }
  .sec_about .sec_ttl h2{
    max-width: 210px;
  }
  .about_txt{
    max-width: 246.26px;
    margin: -28px auto 0 auto;
  }
  .sec_about .about_cnt{
    max-width: 335px;
  }
  
/*----------
04.こんな方におすすめ
----------*/
  .sec_recommend{
    padding: 78px 0 68px;
  }
  .sec_recommend .sec_ttl h2{
    max-width: 335px;
  }
  .recommend_txt{
    max-width: 269.21px;
    margin: -25px auto 0 auto;
  }
  .sec_recommend .recommend_cnt{
    max-width: 335px;
    margin: 57px auto 0 auto;
  }
  
/*----------
05.マワリの強み
----------*/
  .sec_strengths{
    padding: 86px 0 82px;
  }
  .sec_strengths .sec_ttl h2{
    max-width: 335px;
  }
  .strengths_txt{
    max-width: 267.19px;
    margin: -23px auto 0 auto;
  }
  .sec_strengths .strengths_cnt{
    margin: 43px auto 0 auto;
  }
  
/*----------
06.ボタンエリア
----------*/
  .title {
    font-size: 30px;
  }
  .title span {
    margin-right: 5px;
  }
  a.btn-flat{
    padding: 20px 0;
    max-width: 335px;
    font-size: 30px;
  }
  a.btn-flat .for_sp{
    font-size: 25px;
    line-height: 1.4;
  }
  
/*----------
07.サポート
----------*/
  .sec_support{
    padding: 85px 0 72px;
  }
  .sec_support .sec_ttl h2{
    max-width: 280px;
  }
  .sec_support .support_cnt{
    margin-top: 35px;
  }
  .support_txt{
    max-width: 308.16px;
    margin: -25px auto 0 auto;
  }
  
  .sec_supporter{
    padding: 90px 0 83px;
  }
  .sec_supporter .sec_ttl h2{
    max-width: 335px;
  }
  .sec_supporter .supporter_cnt,
  .sec_supporter .supporter_cnt02{
    margin-top: 40px;
  }
  .sec_supporter .cnt_nom02{
    margin-top: 80px;
  }
  .supporter_txt{
    max-width: 304.4px;
    margin: -25px auto 0 auto;
  }
  .supporter_txt02{
    max-width: 335px;
    margin: 0 auto;
  }
  
/*----------
09.プラン
----------*/
  .sec_plan{
    padding-top: 95px;
    padding-bottom: calc(10vw + 120px);   
  }
  .sec_plan .sec_ttl h2{
    max-width: 162px;
  }
  .sec_plan .plan_txt{
    max-width: 252px;
    margin: -18px auto 0 auto;
  }
  .sec_plan .plan_cnt{
    margin-top: 40px;
  }
  .sec_plan .plan_cnt02{
    margin-top: 40px;
  }
  .sec_plan .plan_more{
    font-size: 25px;
    letter-spacing: -0.02em;
  }
  .sec_plan .plan_txt02{
    max-width: 335px;
  }
  .sec_plan .cnt_nom02{
    margin-top: 50px;
  }
  .btn_nom02{
    margin-top: 0;
    padding: 28px 0 70px;
  }
  .sec_plan::before {
    border-bottom: 30vw solid #D45236; 
  }
  .sec_plan::after {
    border-bottom: 30vw solid #D45236;
  }
  
/*----------
11.収支について
----------*/
  .sec_balanceof{
    padding: 88px 0 80px;
  }
  .sec_balanceof .sec_ttl h2{
    max-width: 335px;
  }
  .sec_balanceof .balanceof_txt{
    max-width: 242.77px;
    margin: -25px auto 0 auto;
  }
  .sec_balanceof .balanceof_cnt{
    margin-top: 38px;
  }
    
/*----------
12.開業の流れ
----------*/
  .sec_flow{
    padding: 98px 0 80px;
  }
  .sec_flow .sec_ttl h2{
    max-width: 168px;
  }
  .sec_flow .flow_txt{
    max-width: 301px;
    margin: -20px auto 0 auto;
  }
      
/*----------
13.オーナーの声
----------*/
  .sec_voice{
    padding: 96px 0 78px;
    background-color: #D6583E;
  }
  .sec_voice .sec_ttl h2{
    max-width: 206px;
  }
  .sec_voice .voice_txt{
    max-width: 238.08px;
    margin: -22px auto 0 auto;
  }
  .sec_voice .voice_cnt{
    margin-top: 36px;
  }
  
/*----------
14.ボタン３
----------*/
  .btn_nom03{
    padding: 75px 0 70px;
  }
	
/*----------	
	15.モーダルウィンドゥ
	----------*/
	.modalWrapper {
  max-width: 324px;
}



	.modalContents p{
		font-size: 0.8rem;
	}


.modalContents input{
	padding-top: 5px;
	padding-bottom: 1px;
	padding-left: 10px;
	margin-bottom: 20px;
	width: 200px;
	height: 15px;
	font-size: 0.8rem;
	letter-spacing:0.2rem;
}

.check{
	width: 200px;
	height: 50px;
	margin: 0 auto;
}

.check input{
	font-family: Noto Sans JP;
	color: #FFFFFF;
	background-color: #79C0CF;
	width: 100%;
	height: 100%;
	padding-bottom: 6px;
	border-radius: 50px;
}
.closeModal {
  position: absolute;
  top: 1.0rem;
  right: 1.5rem;
	font-size: 2.0rem;
  cursor: pointer;
}


/* 以下ボタンスタイル */
button {
  padding: 10px;
  background-color: #fff;
  border-radius: 2px;
  cursor: pointer;
}
	
/*----------
16.フッター
----------*/
	.footer{
		padding: 20px 0;
	}
	.link_area{
		display: block;
		text-align: center;
	}
	
	.catchcopy{
		font-size: 1.2rem;
		line-height: 2.0rem;
		margin-bottom: 50px;
	}
	.site_link a{
	padding: 30px 60px 25px 70px;
}

.site_link a::before{
	left: 40px;
}
.site_link a::after{
	right: 40px;
}
}






@media only screen and (max-width:425px){
/*----------
01.メインビジュアル
----------*/
  .main_area .flowing_tx span{
    animation : flowing 5s linear infinite;
  }
  
/*----------
09.プラン
----------*/
  .sec_plan{
    padding-top: 95px;
    padding-bottom: calc(10vw + 91px);   
  }
}