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

@media screen and (min-width:769px) {
	/* PC 769px以上 */
	html {
		font-size: 62.5%;
	}
	/* bodyのフォントサイズを1.6em（16px）に設定 */
	body {
		font-size: 1.6em;
	}
}
@media screen and (max-width:768px) {
	/* タブレット 768px以下 */
	html {
		font-size: 3vw;
	}
}
@media screen and (max-width:480px) {
	/* スマートフォン 480px以下 */
	/*html {
		font-size: 3.4vw;
	}*/
}
* {
	margin: 0px;
	padding: 0px;
	font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Meiryo", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", sans-serif;
}
ul, li {
	list-style: none;
}
header {
	background: #F9F9F9;
	height: 100px;
	width: 100%;
	border-top: #00C3B6 4px solid;
}
header h1 {
	line-height: 1em;
	/* font-size: 12px; フォント指定*/
	font-size: 1.2rem;
	font-weight: bold;
	color: #333;
	margin: 5px 0px 10px 0px;
	width: 500px;
	float: left;
}
.header_wrapper {
	width: 950px;
	height: 100px;
	margin: 0px auto;
	position: relative;
}
.header_wrapper .tel {
	display: flex;
	align-items: center;
	justify-content: flex-start;
}
.header_wrapper .tel a {
	text-decoration: none;
}
.header_wrapper .tel span {
	display: block;
	/* font-size: 24px; フォント指定*/
	font-size: 2.4rem;
	color: #00C3B6;
	transform: scale(1, 1.3);
	padding-top: 2px;
	line-height: 1em;
}
.header_wrapper .tel svg { /*フリーダイヤルアイコンのサイズ*/
	height: 30px;
	width: auto;
	margin-right: 5px;
}
.header_wrapper .tel .st0 { /*フリーダイヤルアイコンの色*/
	fill: #00C3B6;
}
.header_contact {
	width: 225px;
	float: right;
	font-weight: bold;
}
.header_contact p {
	padding-top: 0px !important;
}
.header_contact i {
	margin-right: 3px;
}
.header_contact .title {
	/* font-size: 10px; フォント指定*/
	font-size: 1rem;
	color: #000;
	letter-spacing: 0.2em;
	line-height: 1em;
	margin: 10px 0px 6px;
}
.header_contact .time {
	/* font-size: 12px; フォント指定*/
	font-size: 1.2rem;
	font-family: monospace;
	line-height: 1.2em;
	margin: 4px 0px 2px 0px;
}
.header_wrapper .logo_img {
	position: absolute;
	top: 44px;
	left: 0px;
}
.top_navi {
	float: right;
	width: 300px;
	margin: 27px 20px 0px 0px;
}
.top_navi li {
	float: right;
	list-style: none;
	margin: 0px 20px 0px 0px;
	line-height: 1em;
	/* font-size: 16px; フォント指定*/
	font-size: 1.6rem;
}
.top_navi li a {
	color: #00C3B6;
	/* font-size: 12px; フォント指定*/
	font-size: 1.2rem;
	border-bottom: 1px dashed #00C3B6;
	text-decoration: none;
}
.top_navi li a:hover {
	color: #e47b9e;
	border-color: #e47b9e;
}
.top_navi li small {
	/* font-size: 10px; フォント指定*/
	font-size: 1rem;
}
.menu-btn {
	display: none;
}
#menu-btn-check {
	display: none;
}
.contact {
	background: #00C3B6;
	padding: 80px 0px;
}
.contact a {
	text-decoration: none;
}
.contact_btn {
	margin: 0 auto;
	display: flex;
	height: 60px;
	width: 550px;
	align-items: center;
	justify-content: center;
	color: #00C3B6;
	background: #FFF;
	transition: 0.3s;
}
.contact_btn:hover {
	transform: scale(1.03);
	transition: 0.3s;
}
.contact_btn img {
	height: 13px;
	width: auto;
	margin-right: 10px;
}
.contact .company {
	width: 450px;
	margin: 0 auto;
}
.contact .company h3 {
	/* font-size: 18px; フォント指定*/
	font-size: 1.8rem;
	color: #FFF;
	margin-top: 32px;
	margin-bottom: 8px;
	text-align: left;
}
.contact .company dl {
	display: flex;
	flex-wrap: wrap;
}
.contact .company dt {
	width: 100px;
	color: #FFF;
}
.contact .company dd {
	width: 350px;
	color: #FFF;
}
/*フロートメニュー*/
.float_menu{
	float:right;
	padding:5px;
	position:fixed;
	margin:0 auto;
	right:20px;
	bottom:20px;
	background:#3f79ff;
	right:calc(((100% - 930px) / 2) - 200px);
}
.special .float_menu{
	right:20px;
}
.pc_none{
	display:none;
}
.float_menu .contact_title{
	color:#FFF;
	margin:8px auto;
	font-size:14px;
	line-height:18px;
}
.float_menu .mail,
.float_menu .tel{
	background:#FFF;
	width:180px;
	height:70px;
	border-radius:0px;
	box-shadow:0px 0px 6px -3px #898989;
}
.float_menu .mail:hover{
	background:#FF9;
}
.float_menu .mail{
	margin:5px auto;
	display:flex;
	align-items:center;
}
.float_menu .mail img{
	float:left;
	margin:auto 10px auto 25px;
}
.float_menu a{
	text-decoration:none;
	display:block;
	color:#000;
}
.float_menu .contact_title{
	font-size:14px;
	line-height:18px;
	text-align:center;
}
.float_menu .mail .mail_title{
	font-size:13px;
	line-height:21px;
	float:left;
	text-align:left;
}	
.float_menu .tel {
	margin:5px auto 0px auto;
	overflow:hidden;
}
.float_menu .tel .tel_title{
	text-align:center;
	font-size:13px;
	line-height:21px;
	margin-top:5px;
}
.float_menu .tel p{
	display:block;
}
.float_menu .tel .tel_num{
	font-size:18px;
	font-weight:bold;
	color:#3f79ff;
	text-align:center;
}
.float_menu .tel .time{
	font-size:10px;
	color:#3f79ff;
	text-align:center;
}
@media screen and (min-width: 481px) and (max-width: 950px) {
	.top_navi{
		margin-top: 54px;
	}
	/*フロートメニュー*/
	.float_menu.sp_none{
		display: none;
	}
	.float_menu.pc_none{
		display: flex;
		left: 50%;
		transform: translate(-50%, 0%);
		height: 70px;
		background: #1F7AFF;
	}
	
	.float_menu.pc_none a{
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.float_menu{
		position:fixed;
		bottom:0px;
		width:100%;
		box-sizing:border-box;
		border-top:1px solid #FFF;
		font-family:"ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", Osaka-mono, monospace;
		right: inherit;
	}
	
	.float_menu .contact_title{
		display:none;
	}
	.float_menu .tel,
	.float_menu .mail,
	.float_menu .ext{
		background: #1F7AFF;
		width: 100%;
		height: 100%;
		margin: 0px;
		padding: 0px;
	}
	.float_menu .mail .mail_title,
	.float_menu .tel .tel_num,
	.float_menu .ext .mail_title{
		color: #FFF;
		font-size: 14px;
		font-weight: bold;
		text-align: center;
	}
	.float_menu .mail i,
	.float_menu .tel i,
	.float_menu .ext i{
		color: #FFF;
		font-size: 14px;
		font-weight: 900;
		margin-right: 5px;
	}
	
	
	.float_menu .mail, .float_menu .tel{
		border-right: 1px solid #FFF;
	}
	.float_menu .tel.sp{
		display: none;
	}
}
@media screen and (max-width: 480px){

	.fontawesome:before{
		font-family: "Font Awesome 5 Free";
		content: '\f007';
		font-weight: 900;
	}
	.sp_none{
		display:none;
	}
	/*フロートメニュー*/
	.float_menu{
		position:fixed;
		bottom:0px;
		width:100%;
		background:#36F;
		border-top:1px solid #FFF;
		font-family:"ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", Osaka-mono, monospace;
	}
	.float_menu .contact_title{
		display:none;
	}
	/*
	.float_menu .mail{
		width:100%;
		float:left;
		height:7vh;
		line-height:7vh;
		text-align:center;
		font-size:3vw;
	}
	*/
	.float_menu .mail,
	.float_menu .tel{
		border-right:1px solid #FFF;
		box-sizing:border-box;
	}
	.float_menu .mail,
	.float_menu .tel,
	.float_menu .ext{
		width: 33%;
		float: left;
		line-height: 1.2em;
		text-align: center;
		font-size: 3vw;
		padding: 1vh 0;
		text-decoration:none;
		box-sizing:border-box;
	}
	.float_menu .mail img{
		height:1em;
	}
	.float_menu .mail,
	.float_menu .tel{
		border-bottom:1px solid #FFF;
	}
	.float_menu .tel p,
	.float_menu .mail p,
	.float_menu .ext p,
	.float_menu .chat p,
	.float_menu .tel i,
	.float_menu .mail i,
	.float_menu .ext i,
	.float_menu .chat i{
		display:inline;
		color:#FFF;
		margin-left:1%;
	}
	.float_menu .ext img{
		height:1em;
		width:auto;
	}
	.float_menu .mail i,
	.float_menu .ext i,
	.float_menu .tel i{
		margin-right:1vw;
	}
	.float_menu .tel.tab{
		display: none;
	}
}

@media screen and (max-width:950px) {
	header h1 {
		width: auto;
		position: absolute;
		left: 0px;
		top: 0px;
		padding-left: 10px;
		box-sizing: border-box;
	}
	.header_wrapper .logo_img {
		left: 10px;
	}
	.header_wrapper {
		width: 100%;
	}
	.topimg .contents {
		width: 100%;
	}
	.topimg .contents .right, .topimg .contents .left {
		width: 50%;
	}
	.topimg .contents .right p {
		font-size: 2vw;
	}
	.topimg .contents .right img, .topimg .contents .left img {
		width: 100%;
	}
	.topimg .contents .right img {
		margin-bottom: 2vh;
	}
	.topimg .contents .right p {
		line-height: 1.4em;
	}
}
@media screen and (max-width:768px) {
	/*　ハンバーガーボタン　*/
	.menu-btn {
		position: absolute;
		top: 20px;
		right: 10px;
		display: flex;
		height: 45px;
		width: 45px;
		justify-content: center;
		align-items: center;
		z-index: 90;
		background-color: #00C3B6;
	}
	.menu-btn span, .menu-btn span:before, .menu-btn span:after {
		content: '';
		display: block;
		height: 3px;
		width: 25px;
		border-radius: 3px;
		background-color: #ffffff;
		position: absolute;
	}
	.menu-btn span:before {
		bottom: 8px;
	}
	.menu-btn span:after {
		top: 8px;
	}
	#menu-btn-check:checked ~ .menu-btn span {
		background-color: rgba(255, 255, 255, 0); /*メニューオープン時は真ん中の線を透明にする*/
	}
	#menu-btn-check:checked ~ .menu-btn span::before {
		bottom: 0;
		transform: rotate(45deg);
	}
	#menu-btn-check:checked ~ .menu-btn span::after {
		top: 0;
		transform: rotate(-45deg);
	}
	#menu-btn-check:checked ~ .menu-content {
		left: 0;
	}
	.menu-content {
		width: 100%;
		height: 100%;
		position: fixed;
		top: 0;
		left: 100%;
		z-index: 80;
		background-color: #00C3B6;
		transition: all 0.5s;
	}
	.menu-content ul {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		width: 92%;
		margin-right: 4%;
	}
	.menu-content ul li {
		border-bottom: solid 1px #ffffff;
		list-style: none;
		width: 100%;
	}
	.menu-content ul li a {
		display: block;
		width: 100%;
		font-size: 15px;
		box-sizing: border-box;
		color: #ffffff;
		text-decoration: none;
		padding: 9px 15px 10px 0;
		position: relative;
	}
	.menu-content ul li a:hover {
		text-decoration: none;
		border: none;
	}
	.menu-content ul li a::before {
		content: "";
		width: 7px;
		height: 7px;
		border-top: solid 2px #ffffff;
		border-right: solid 2px #ffffff;
		transform: rotate(45deg);
		position: absolute;
		right: 11px;
		top: 16px;
	}
	.menu-content .top_navi li {
		margin-right: 0px;
		margin-top: 2vh;
	}
	.menu-content .top_navi li a {
		border: none;
	}
	/*　ハンバーガーメニューここまで　*/
	header h1 {
		width: 100%;
	}
	.header_wrapper .top_navi {
		flex-direction:column-reverse;
	}
	.header_contact {
		margin-right: 65px;
		width: auto;
		margin-top:  18px;
	}
	.header_contact .title {
		display: none;
	}
	.header_contact .title {
		font-size: 2vw;
	}
	.header_wrapper .tel span {
		font-size: 4vw;
		padding: 0px;
	}
	.header_contact .time {
		font-size: 1.5vw;
		line-height: 1.5em;
		margin-top: 3px;
	}
	header h1 {
		font-size: 1rem;
	}
	.header_wrapper .logo_img {
		top: 4vh;
		width: 30vw;
	}
}
@media screen and (max-width:480px) {
	header {
		height: 80px;
	}
	.header_contact {
		margin-top: 18px;
	}
	.header_wrapper .logo_img {
		width: 100px;
	}
	.header_wrapper .tel svg {
		height: 25px;
	}
	.header_wrapper .tel span {
		font-size: 2rem;
	}
	.header_contact .time {
		font-size: 1rem;
		line-height: 1.2em;
	}
	.header_wrapper .logo_img {
		top: 25px;
	}
}

/*-------------------------
clearfix
-------------------------*/
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	display: inline-block;
}
/* Hides from IE-mac \*/
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}
/* End hide from IE-mac */
/*-------------------------
clearfixここまで
-------------------------*/