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

@media screen and (max-width:480px) {

	main {
		overflow: hidden;
	}

	.main_text {
		top: 40%;
	}

	body {
    	width: 100vw;
    	padding-top: 90px;
		overflow-x: hidden;
		margin:0;
		word-wrap : break-word;
		word-break: break-all;
		overflow-wrap : break-word;
		width: 900px;
		-webkit-text-size-adjust: 100%;
		min-width: 100%;
		max-width:100%;
		height:100vh;
		box-sizing:border-box;
		overflow: scroll;
   		-webkit-overflow-scrolling: touch;

	}
	
	.sp_none{
		display: none !important;
	}
	
	p.myname.myname_end.sp_none {
    	display: none !important;
	}
	
	.sp-pb {
		padding-bottom: 15px;
	}
	
	.sp-display {
		display: inline;
	}
	
	#wrapper {
    	width: 100vw;
		margin:0px;
		/*
		overflow-x: hidden;
		overflow-y: scroll;
  		-webkit-overflow-scrolling: touch;
		  */
	}
	
	header {
		width: 100vw;
		top: 0px;
		z-index: 99990;
		background-color:#282951;
		padding-top: 0;
		overflow-x: hidden;
		position: fixed;
	}
	
	h1 {
		padding: 10px;
		font-size: 9px;
	}
	nav ul {
		padding: 16px;
	}
	
	nav li {
    	margin: 0px 9px;
    	font-size: 10px;
	}
	
	main {
    	width: 100vw !important;
		 -webkit-overflow-scrolling: touch !important;

	}
	
	
	header p {
		text-align: left;

	}
	
	.logo img {
    width: 200px;
    margin-top: 50px;
    margin-bottom: 30px;
    margin: 10px auto;
	}
	.conteiner {
    width: 100%;
	}
p.center_p {
    text-align: left;
	}
	.pc_br{
	display:none;}
/* ハンバーガー */
	
	.hm_wrap {
    	display: inline-block !important;
    	position: fixed;
    	top: 48px;
    	left: 0;
    	width: 100%;
    	padding: 0px 10px;
    	background-color: #fff;
    	z-index: 1000;
	}
	
	.hm_menu_check {
    	display: none;
	}
	
	.hm_btn {
    	position: absolute;
    	width: 30px;
    	height: 30px;
    	cursor: pointer;
    	display: block;
    	float: left;
    	z-index: 2;
    	right: 30px;
	}
	
	.hm_btn::before {
    	-webkit-box-shadow: #000 0 12px 0;
    	box-shadow: #000 0 12px 0;
	}
	
	*, *::before, *::after {
    	box-sizing: border-box;
	}
	
	.hm_btn::before, .hm_btn::after {
    	width: 30px;
    	height: 6px;
    	background: #000;
    	display: block;
    	content: '';
    	position: absolute;
    	-webkit-transition: -webkit-box-shadow 0.2s linear, -webkit-transform 0.2s 0.2s;
    	transition: box-shadow 0.2s linear, transform 0.2s 0.2s;
	}
	
	.hm_btn::before, .hm_btn::after {
    	width: 30px;
    	height: 6px;
    	background: #000;
    	display: block;
    	content: '';
    	position: absolute;
    	-webkit-transition: -webkit-box-shadow 0.2s linear, -webkit-transform 0.2s 0.2s;
    	transition: box-shadow 0.2s linear, transform 0.2s 0.2s;
	}
	
	.hm_btn::after {
    	bottom: 0;
	}
	
	*, *::before, *::after {
    	box-sizing: border-box;
	}
	
	.hm_menu_wrap {
    	width: 100%;
    	height: 10000px;
    	background: #fff;
    	position: absolute;
    	left: -100%;
    	top: 0;
    	-webkit-transition: left 0.4s;
    	transition: left 0.4s;
	}
	
	div {
    	max-width: 100%;
    	height: auto;
	}
	
	.hm_menu_wrap ul {
    	background-color: #fff;
    	display: block;
    	width: 100%;
	}
	
	.hm_menu_wrap ul li {
    	border-bottom: 1px solid #ccc;
    	padding: 10px;
	}
	
	ul.hm_list img {
		width: 3em;
	}
	
/* ▽▽ハンバーガーメニュー▽▽
------------------------------------------------------- */
.header_cont {
    width: 100%;
    margin: 0 auto;
    display: block;
	}
	
.hm_menu_check {/* チェックボックスを隠す */
  display: none;
}
.hm_wrap {
	display: inline-block;
    position: fixed;
    top: -30px;
    left: 0;
    width: 100%;
    padding: 0px 10px;
    background-color: #fff;
	z-index:999999;
}

.hm_title {/* ハンバーガーメニューオープン時の見出し */
	position: relative;
	color: #999;
	display: inline-block;
	float:left;
	font-weight: 100;
	line-height: 30px;
	margin: 0 0 0 15px;
	opacity: 0;
	-webkit-transform: translate3d(0, -15px, 0);
	transform: translate3d(0, -15px, 0);
	-webkit-transition: -webkit-transform 0.6s, opacity 0.5s;
	transition: transform 0.6s, opacity 0.5s;
	z-index: 2;
}

/* ▽▽メニューボタン▽▽ */
.hm_btn {
	position: absolute;
	width: 30px;
	height: 30px;
	cursor: pointer;
	display: block;
	float: left;
	z-index: 2;
	right:30px;
	top: 60px;
}
.hm_btn::before {
	-webkit-box-shadow: #000 0 12px 0;
	box-shadow: #FFF 0 12px 0;
}
.hm_btn::after {
	bottom: 0;
}
.hm_btn::before,
.hm_btn::after {
	width: 30px;
	height: 6px;
	background: #FFF;
	display: block;
	content: '';
	position: absolute;
	-webkit-transition: -webkit-box-shadow 0.2s linear, -webkit-transform 0.2s 0.2s;
	transition: box-shadow 0.2s linear, transform 0.2s 0.2s;
}
/* △△メニューボタン△△ */

.hm_menu_wrap {
	width :100%;
	height :10000px;
	background:#282951;
	position: absolute;
	left: -100%;
	top: 0;
	-webkit-transition: left 0.4s;
	transition: left 0.4s;
}

.hm_menu_wrap ul {
    background-color: #282951;
    display: block;
    width: 100%;
}

.hm_menu_wrap ul li {
    border-bottom: 1px solid #ccc;
    padding: 25px;
    display: flex;
    align-items: center;
}

/* ▽▽開閉時のアニメーション▽▽ */
.hm_menu_check:checked ~ .hm_title {
	opacity: 1;
	-webkit-transform: none;
	-ms-transform: none;
	transform: none;
}
.hm_menu_check:checked ~ .hm_btn::before {
	-webkit-box-shadow: transparent 0 0 0;
	box-shadow: transparent 0 0 0;
	-webkit-transform: rotate(45deg) translate3d(6px, 11px, 0);
	transform: rotate(45deg) translate3d(6px, 11px, 0);
}
.hm_menu_check:checked ~ .hm_btn::after {
	-webkit-transform: rotate(-45deg) translate3d(6px, -11px, 0);
	transform: rotate(-45deg) translate3d(6px, -11px, 0);
}
.hm_menu_check:checked ~ .hm_menu_wrap {
	left: 0;
}

/* △△開閉時のアニメーション△△ */

/* ▽▽メニュー内のリストスタイル▽▽ */
.hm_list {
	list-style-type: none;
	margin: 50px 0 0;
	padding: 0;
}
.hm_list li a {
	color: #777;
	display: block;
	overflow: hidden;
	padding: 12px 22px;
	position: relative;
	text-decoration: none;
	z-index: 1;
	margin:10px;
}

.hm_list li{
	border-bottom:1px solid #777;	
}
.hm_list li a::before {/* aタグマウスオーバー時の背景 */
	background: #eee;
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 100%;
	left: 0;
	-webkit-transition: bottom 0.4s;
	transition: bottom 0.4s;
	z-index: -1;
}

.hm_list li a:hover::before {
	bottom: 0;
}
.hm_list li a:hover::after {
	opacity: 0.5;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}

.hm_cont {
    position: absolute;
    top: 5em;
		height: 100vw;
		width: 100%;
}
/* メニュー内のリストスタイル△△ */

/* △△ハンバーガーメニュー△△
------------------------------------------------------- */	
	
	
	/* ハンバーガー終わり */
	
	.flex {
    display: flex;
    flex-wrap: wrap;
}
	
.header_logo img {
    width: 65px;
    padding: 5px 0px 3px 10px;
}

.mainpic_text {
    top: 20em;
    font-size: 132%;
}

.mainpic.sp {
		top: 83px;
		width:100%;
}

main {
    top: 510px !important;
}

.news_cont img {
    width: 100%;
}

.about_us > .container > .topic_text {
    font-size: 1.8em;
    line-height: 1.3em;
}

.list_up_cont {
    width: 50%;
}
	
.list_down_cont {
    width: 50%;
}
	
.container {
    width: 100vw;
}
	
.section_list_cont img {
    height: 130px;
}
	
.btn {
    padding: 2em 0.5em 7em 0.5em;
}
	
.news_cont {
    padding: 1.5em 0.5em;
}

.news_text {
    padding: 1em 0 0 0;
}
	
.news_cont.flex {
    display: block;
}
	
.news_cont div {
    width: 100%;
}
	
.performance_list li {
    font-size: 0.7em;
    line-height: 1.3em;
    padding: 0.5em;
    margin: 0.5em 0.3em;
}
	
.my_performance {
    margin: 2em 0.5em;
}
	
.footer_bottom {
    font-size: 0.8em;
}
	
.mainpic.sp img {
    height: 540px;
    object-fit: cover;
}
	
.main_logo img {
width: 100vw;
    top: 40%;
}
	
.sp_top_logo {
    width: 85vw !important;
    top: 28%!important;
}
	
.service_detail .topic_text {
    font-size: 1.3em;
	line-height: 1.3em;
	padding: 0 0.5em;
}
	
.service_detail .normal_text {
    font-size: 0.8em;
	padding: 0 0.5em;
}
	
.service_tittle {
    font-size: 1.7em;
}
	

.footer_2 {
    top: 0px;
}

.contact_section {
    padding: 0 0.5em;
	font-size: 80%;
}

.contact_table th {
    display: block;
    width: 100% !important;
    text-align: center;
    padding-left: 0 !important;
}

.contact_table td {
    display: block;
    width: 100%;
    padding: 1em 1em !important;
}

table.formtable td input {
    margin: 5px;
}
table.formtable td textarea {
    width: 100% !important;
    height: 200px;
    margin: 0 !important;
}
.contact_section h2 {
    font-size: 1.9em;
}

.contact_table table {
    width: 90%;
}

.btn {
    font-size: 70%;
}

.aboutus_cont {
    padding: 0 0.5em;
}

.main_news {
    padding: 5em 0.5em;
}

.page_nations {
    padding: 2em 0.5em;
}

ul.exam_images.flex li {
    width: 49%;
    padding: 0em 0;
}

ul.exam_images.flex img {
    padding: 0.5em 0;
}

.normal_text {
    font-size: 90%;
}
img.arrow_right {
    width: 45px;
    padding: 0px 10px 5px 10px;
	}
	
.service_2 {
    display: block;
}

.service_list.flex {
    display: block;
	}
	
.service_box {
    height: 385px;
    margin-bottom: 2em;
	}
	
p.service_name {
    font-size: 20px;
	}
.service_box p img {
    width: 100%;
    height: 208px;
    object-fit: cover;
    margin-bottom: 10px;
	}
	
	p.about_service {
		font-size: 17px;
		line-height: 27px;
		padding: 12px;
	}
	
p.center_btn a {
    font-size: 18px;
}
.hm_bottom {
    position: fixed;
    bottom: 0;
    width: 100vw;
}

.about_us {
    padding-bottom: 210px;
}
	
h2.bule_back {
	width: 100%;
    font-size: 25px;
}
.vison_bg {
    width: 100%;
    height: 250px;
}
	
.vison_cont {
    max-width: 340px;
    margin: 0px 10px;
    left: 0;
	top: 100px
}

.achievement_list {
    width: 100vw;
    margin: 0 auto;
    display: flex;
    justify-content: space-around;
}

h2.achievement_top {
    font-size: 30px;
}

.achievement_box {
    width: 90%;
    margin: 1em auto;
    border-radius: 6px;
    display: block;
}
	
p.about_achievement img {
    width: 105px;
}

.achievement_inner p img {
    width: 100%;
	}
	
	.contact_box {
		display: block;
		width: 90%;
		height: 320px;
		margin: 0px auto;
	}
	.contact_inner {
		padding: 30px 0 0;
	}
.vision2_cont p {
    padding: 25px;
    font-size: 14px;
    top: -40px;
	}
.our_vision2 p img {
	width: 100%;
    height: 300px;
    object-fit: cover;
	}
	
.contact_inner2 {
	padding: 0px 30px;
    width: 300px;
}
table.company_table tbody tr th {
    padding: 35px 15px;
    width: 120px;
    text-align: left!important;
    color: #282951;
	}
	
.contact_inner h3 {
    font-size: 30px;
    margin-bottom: 25px;
    padding: 0 12px;
	}
p.copy_text {
    font-size: 13px;
    padding: 0 0 2em 0;
	}
h1.footer_topic {
    text-align: left;
	}
li.nav_cont {
    text-align: left;
    border-bottom: 1px solid;
	}
footer {
    background: #282951;
    padding-top: 1em;
    position: relative;
	z-index: 99;
	height: 630px;
    top: 510px;
	}
	
h2.orange_text {
		padding-bottom: 25px;
	    font-size: 27px;
	}

.building img {
	width: 100%;
	padding-top: 2em;
}
/*サービス内容-----------------------------------------------*/		
.container_service1 {
    margin: 0px;
}
h2.service_h2 {
    padding: 25px 0;
		font-size: 19px;
		font-family: sans-serif;
    letter-spacing: 0px;
	line-height: 32px;
	}
.service_detail_img {
    width: 100%;
		text-align: center;
	padding-bottom: 15px;
	}
	
p.service_detail_img img {
		display: block;
		margin: auto;
	}
	
p.service_detail_p_2 {
    line-height: 20px;
}
.contact_cont_bottom {
    padding: 0;
    margin-top: 100px;
	}
.service_cont2 {
    width: 950px;
    margin: 0 auto;
    display: block;
    padding: 10px;
}
.service_cont2_bottom {
		margin: 0 10px;
		    padding: 22px;
	}
	
.service_cont2_bottom p{
		padding: 6px 10px;
	}
	
p.about_achievement {
	width: 100%;
	font-size: 25px;
	letter-spacing: 5px;
}
	
.service_cont {
    padding: 40px 0 25px;
}

section.achievement_cont {
    padding: 0px 0 60px;
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom: 5em;
}

p.center_p2 {
    width: 100%;
}

.contact_cont {
    background-image: url(../img/contact_back_sp.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
	padding: 20px 0;
}

.service_detail {
    width: 100% !important;
    margin: 0 auto;
    padding-bottom: 30px;
}
/*会社概要-----------------------------------------------*/		
.greeting_cont {
    padding: 10px;
	}

p.name_text {
	padding: 0;
}
p.name_text img {
    width: 360px;
    padding: 10px 20px 10px 0px;
}
.our_vision2 {
    padding: 0em 0 2em 0;
	}

/*セイルについて-----------------------------------------------*/	
.service_cont3{
	display:block;
	}
h2.about_h2 {
    font-size: 25px;
    padding: 0px 50px 20px;
    font-weight: 700;
    line-height: 32px;
}
p.detail_seile_img {
    text-align: center;
	}
.service_detail2 {
	display:block;
	}
p.detail_seile_img img {
    width: 350px;
    padding: 0;
	}
.text_orangeback {
    color: #ac8d57;
    background: none;
    font-weight: 700;
    font-size: 14px;
    display: block;
    padding: 10px 40px;
}
/*セイルについて-----------------------------------------------*/	


/*問い合わせ-----------------------------------------------*/		
div#privacy_policy {
    width: 100%;
    margin: 0 auto;
    padding: 3em 0 3em 0;
	}
form {
		width: 100%;
		font-family: sans-serif;
	}
	
.formtable tbody tr td input[type="text"] {
		width:100%;
		height: 30px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
	
.formtable tbody tr td {
		width:100%;
		padding:none;
		font-family: sans-serif;
	}
table.formtable tbody tr th {
		font-weight: 700;
		width: 100%;
		font-family: sans-serif;
}	
.formtable tbody tr  {
		 display:grid;
	}
table.formtable {
    width: 94%;
    margin-right: 15px;
	}

}


@media screen and (min-width:481px) {
	.sp{
		display: none !important;
	}
	
	
}