@charset "UTF-8";
/* CSS Document */

/***************
スマホ縦画面のみ
***************/
@media only screen and (max-width:999px){
	
	body{
		overflow-x: hidden;
	}
	
	.inner{
		width: 90%;
	}
	
		
	#mainVisual{
		background-size:33%;
	}
	
	#mainContainer{
		width: 95%;
	}


	nav#gNav {
		position: fixed;
		top: 0;
		right: -300px;
		width: 300px;
		height: 100%;
		padding-top: 50px;
		background:#fff;
		font-size: 16px;
		box-sizing: border-box;
		z-index: 2;
		opacity: 0.95;
	}
	nav#gNav ul.gnav_lists li.gnav_list {
		display:block;
		text-align:left;
		padding: .75em 1.5em;
		border-bottom: 1px solid #ccc;
	}
	nav#gNav ul.gnav_lists li.gnav_list a {

		text-decoration: none;
		color: #333;
	}
	
		
	span.dropdown_arrow{
		cursor: pointer;
		margin-left: 1em;
		color: #00b3c4;
	}



	#gNavWrapper .btn-gnavi {

		position: absolute;
		top: 40px;
		right: 20px;
		width: 30px;
		height: 30px;
		z-index: 3;
		cursor: pointer;
		-webkit-transition: all 400ms;
		transition: all 400ms
	}
	#gNavWrapper .btn-gnavi span {
		position: absolute;
		width: 30px;
		height: 2px;
		background: #00b3c4;
		border-radius: 10px;
		-webkit-transition: all 400ms;
		transition: all 400ms
	}
	#gNavWrapper .btn-gnavi span:nth-child(1) {
		top: 0
	}
	#gNavWrapper .btn-gnavi span:nth-child(2) {
		top: 10px
	}
	#gNavWrapper .btn-gnavi span:nth-child(3) {
		top: 20px
	}
	#gNavWrapper .btn-gnavi.open span {
		background: #00b3c4;
	}
	#gNavWrapper .btn-gnavi.open span {
	}

	#gNavWrapper .btn-gnavi.open span:nth-child(1) {
	  -webkit-transform: translateY(10px) rotate(-45deg);
	  transform: translateY(10px) rotate(-45deg);
	}
	#gNavWrapper .btn-gnavi.open span:nth-child(2) {
	  opacity: 0;
	}
	#gNavWrapper .btn-gnavi.open span:nth-child(3) {
	  -webkit-transform: translateY(-10px) rotate(45deg);
	  transform: translateY(-10px) rotate(45deg);
	}	
	
	span.english_title{
		display: none;
	}

	
	ul.dropdown_lists {
		display:none;
		position: relative;
		width: 100%;
		margin-top: 0.5em;
	}


	
	ul.dropdown_lists li{
		list-style-type: "-　";
		list-style-position: inside;
		text-indent: .5em;
		font-size: 95%;
		line-height: 2.5em;
	}
	
	ul.dropdown_lists li a {

		color:#333;
	}

	ul.dropdown_lists li.dropdown_list{
		position: relative;
	}
	
	
	.btn_arrow{
		font-size: 14px;
	}
	
	.btn_arrow_center{
		width: 75%;
	}

	
/*-------サービス内容-------*/
	.area_img img{
		width: 100%;
	}
	
	#Area dl {
		width: 100%;
	}
	
	#Area dl dt{
		width: 33%;
	}
	
	#Area dl dd{
		width: 100%;
	}
	
}

@media only screen and (max-width:767px){
	
	header h1 img{
		height: 60px;
	}

	
	.mv_inner{
		width: 100%;
		margin: 0;
		overflow: hidden;
	}
	
	#mainVisual img{
		border-radius: 0px;
		width: 120%;
	}
	
	#mainContainer{
		margin-top: 25px;
		padding: 25px 0;
	}
	
	section#introduction h2{
		font-size: 20px;
	}

	
	section#introduction .sentence{
		width: 100%;
		margin-bottom: 25px;
	}

	section#introduction .photo{
		width: 95%;
	}
	
	ul.worries{
		padding: 20px 20px 0 20px;
	}
	
	ul.worries li.worries_list{
		font-size: 18px;
	}
	
	ul.worries li.img_worries{
		position: relative;
		width: 100%;
		margin-top: 25px;
		text-align: center;
	}



	
	#footerLogoArea{
		width: 100%;
		padding: 25px;
		margin: 0 auto 50px auto;
	}
	
	

	#footerMap{
		width: 100%;
		margin-left: auto;
		margin-right: auto;
	}	
	
	.btn_call a,
	.btn_mail a{
		width: 90%;
	}
	

	
	section#introduction h2,
	section#news h2{
			font-size: 24px;
	}	
	
	section#introduction h3 {
		font-size: 18px;	
	}
	
	section#introduction .img_introduction img{
		width: 90%;
	}

	#AboutLogo .flex_box .logomark_img{
		width: 100%;
		padding: 0 50px 25px 50px;
	}

	#AboutLogo .flex_box .logomark_txt{
		width: 100%;
	}
	
	
/*-------固定ページ-------*/

	#pageTitle h2 {
		margin: 25px 0;
		font-size: 24px;
	}
	
	#main h3 {
		font-size: 24px;
	}	
	
/*-------サービス内容-------*/
	
	.service_content{
		width: 100%;
	}
	
	.service_content h4{
		font-size: 18px;
	}
	
	.feature_txt{
		width: 100%;
	}
	
	.feature_txt h4{
		font-size: 20px;
	}
	
	.feature_img{
		width: 100%;
		order: 1;
		text-align: center;
	}
	
	.feature_img img{
		width: 66.7%;
	}
	
	
/*-------ご利用案内-------*/	
	
	#TargetAudience{
		width: 100%;
	}
	
	#TargetAudience .flex_box .txt{
		width: 100%;
	}

#TargetAudience .flex_box .img{
		width: 50%;
		margin: 20px auto;
	}	
	
	.usage_flow {
		width:100%;
		padding: 1em 5%;
	}
	
	.usage_flow h4{
		font-size: 20px;
	}
	
	.usage_flow ul.contact span{
		font-size: 16px;
	}
		
		
	#Price table{
		width: 100%;
	}
	
	#Price table th,
	#Price table td{
		font-size: 14px;
	}
	
	#Price table span{
		font-size: 16px;
		line-height: 1.2em;
	}
	
	#Price .annotation{
		text-align: left;
	}

/*-------お問い合わせ-------*/	
	
	div#ContactForm {
		padding: 0;
		border: none;
		width: 100%;
	}
	
	.wpcf7 input[type="text"],
	.wpcf7 input[type="email"],
	.wpcf7 input[type="tel"]{
		width: 75%;
	}
	

}