/* --------------------------------------------------
 * html
-------------------------------------------------- */
html {
	scroll-behavior: smooth;
}
body {
	background: #e8f0f7;
}
h1, h2, h3, h4, h5, h6 {
	margin-bottom: 0;
}
p {
	margin: 0;
}
img {
	max-width: 100%;
	vertical-align: bottom;
}
dl, ol, ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
dd {
	margin-bottom: 0;
}
address {
	margin: 0;
}
/* --------------------------------------------------
 * 全機種共通
-------------------------------------------------- */
.header {
	max-width: 640px;
	margin: 0 auto;
	background: #02173d;
}
.header h1 {
	padding: 10px 0;
	font-size: 14px;
	font-weight: normal;
	color: #cfa245;
	text-align: center;
}
.main {
	margin: 0 auto;
	background: #fff;
}
.section {
	position: relative;
}
.bg-white-radius {
	width: 95%;
	margin: 0 auto;
	background: #fff;
}
.bg-white-double{
	width: 95%;
	margin: 0 auto;
	border: 6px double #cfa245;
	background: #fff;
	box-sizing: content-box;
}

.float-nav {
	position: -webkit-sticky;
	position: sticky;
	bottom: 0;
	animation: navi 3s ease 0s 1 normal;
	z-index: 10;
}
@keyframes navi {
	0%   {transform: translateY(100%);opacity: 0;}
	66%  {transform: translateY(100%);opacity: 0;}
	100% {transform: translateY(0);opacity: 1;}
}
.float-btn {
	border-top: #02173d 2px solid;
	border-right: #02173d 1px solid;
	background: rgba(255,255,255,.75);
	font-size: 0;
}
.float-btn>li {
	width: calc((100% - 3px) / 3);
	display: inline-block;
	border-left: #02173d 1px solid;
	box-sizing: content-box;
	font-size: 14px;
	text-align: center;
}
.float-btn a {
	display: block;
}
.float-btn img {
	max-width: 80%
}

.footer {
	padding: 10px 0;
	background: #02173d;
	text-align: center;
}
.footer a {
	color: #cfa245;
	font-size: 14px;
}

/*----- button -----*/
.button {
	background: #fff;
	padding: 30px 5%;
}
.button p+p {
	margin-top: 10px;
}
.button a img {
	transition: 0.6s;
}
.button a:hover img {
	opacity: 0.75;
	transform: translateY(-5px);
}
/*----- concept -----*/
.concept {
	background: #fff;
}
.concept-text {
	width: 50%;
	float: left;
}
.concept-img {
	width: 50%;
	float: right;
}
/*----- enquete -----*/
.enquete-content {
	margin-top: -24px;
	padding-top: 24px;
	padding-bottom: 30px;
	background: #fff;
}
/*----- interview -----*/
.interview-title {
	background: #02173d;
	text-align: center;
}
.interview-content-wrap {
	padding: 10px 0;
	background: #8f6642 url(../img/interview-content-wrap-bg.png) repeat;
}
.interview-content {
	border-radius: 5px;
	padding: 5px 0;
	background: #9e724b url(../img/interview-content-bg.jpg) repeat;
	box-shadow: inset 2px 3px 3px rgba(255,255,255,.5), inset -2px -3px 3px rgba(0,0,0,.5);
}
.interview-content li {
	float: left;
	width: 50%;
}
/*----- menu -----*/
.menu {
	border-top: 1px solid #cfa245;
	border-bottom: 1px solid #cfa245;
	background: #02173d;
}
.menu-content>li {
	float: left;
	width: 20%;
	border-left: 1px solid #003;
	border-right: 1px solid #003;
}
.menu-content>li:hover img {
	transition: 0.3s;
	opacity: 0.75;
}
/*----- office -----*/
.office-title {
	background: #02173d;
	text-align: center;
}
.office-content li {
	float: left;
	width: 50%;
}
/*----- project -----*/
.project {
	padding-bottom: 30px;
	background: #02173d;
}
.project-title {
	margin-bottom: 20px;
	padding: 10px 0;
	background: #cfa245;
	text-align: center;
}
.project-content>li {
	padding: 10px 0 20px;
}
/*----- salary -----*/
.salary-title-wrap {
	margin-bottom: 6.25%;
	background: #f2ffff url(../img/salary-bg.png) repeat;
}
.salary-title, .salary-title-text {
	text-align: center;
}
.salary-content>li {
	padding-bottom: 3.75%;
	background: #dff6f7 url(../img/salary-content-bg.png) repeat;
}
.salary-content>li+li {
	margin-top: 6.25%;
}
.salary-box {
	max-width: 640px;
	margin: 0 auto;
}
.salary-box>dt {
	width: 45%;
}
.salary-box>dd {
	width: 55%;
}
.salary-content>li:nth-child(odd) .salary-girl, .salary-content>li:nth-child(even) .salary-comment {
	float: left;
}
.salary-content>li:nth-child(odd) .salary-comment, .salary-content>li:nth-child(even) .salary-girl {
	float: right;
}
.salary-comment dl {
	background: #448ca5
}
.salary-comment dt {
	transform: translateY(-60%);
}
.salary-comment dd {
	margin-top: -10%;
}
/*----- satisfaction -----*/
.satisfaction {
	padding-bottom: 20px;
	background: #02173d;
}
.satis-title {
	margin-bottom: 20px;
	background: #fff;
	text-align: center;
}
.satis-content li {
	padding: 10px 0 20px;
}

/* --------------------------------------------------
 * スマホ
-------------------------------------------------- */
@media(max-width:640px) {
	.bg-white-radius {
		border-radius: 6.25vw;
	}

	.project-content .contet-01 ol {
		margin-bottom: 10px;
	}
	.project-content .bg-white-radius {
		margin-top: -17vw;
		padding-top: 17vw;
	}
	.project-content .contet-02 .bg-white-radius {
		margin-top: -15.625vw;
		padding-top: 15.625vw;
	}
	.project-content .contet-03 .bg-white-radius {
		margin-top: -26.5vw;
		padding-top: 26.5vw;
	}
	.project-content .contet-03 ol {
		padding-bottom: 10px;
	}
	.project-content .contet-04 .bg-white-radius {
		margin-top: -32.8vw;
		padding-top: 32.8vw;
	}
	.project-content .contet-04 ul {
		padding-bottom: 10px;
	}

	.salary-title-text {
		border-bottom: 4px solid #448ca5;
	}
	.salary-content>li {
		border-top: 2px solid #448ca5;
		border-bottom: 4px solid #448ca5;
	}
}
/* --------------------------------------------------
 * タブレット＆PC
-------------------------------------------------- */
@media(min-width:641px) {
/*	body {
		background: #e8f0f7;
	}*/
	.header, .main, .footer {
		max-width: 960px;
		margin-left: auto;
		margin-right: auto;
	}
	.width-keeper {
		width: 640px;
		margin-left: auto;
		margin-right: auto;
	}
	.bg-white-radius {
		width: 608px;
		border-radius: 40px;
	}

	.bg-white-double{
		outline: 1px solid #cfa245;
	}

	.float-nav {
		width: 960px;
		margin-left: auto;
		margin-right: auto;
	}

	.button {
		padding: 30px 5% 25px;
	}
	.button p+p {
		margin-top: 20px;
	}

	.enquete-title {
		position: relative;
		text-align: center;
	}
	.enquete-title:before {
		width: 100%;
		height: 76px;
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		background: #02173d;
		content: "";
	}
	.enquete-title img {
		position: relative;
		z-index: 5;
	}

	.interview-content-wrap, .interview-content {
		padding: 20px 0;
	}
	.interview-content li {
		width: 320px;
	}

	.project-content .bg-white-radius {
		margin-top: -110px;
		padding-top: 110px;
	}.project-content .contet-02 .bg-white-radius {
		margin-top: -100px;
		padding-top: 100px;
	}
	.project-content .contet-03 .bg-white-radius {
		margin-top: -170px;
		padding-top: 170px;
	}
	.project-content .contet-03 ol {
		padding-bottom: 20px;
	}
	.project-content .contet-04 .bg-white-radius {
		margin-top: -210px;
		padding-top: 210px;
	}
	.project-content .contet-04 ul {
		padding-bottom: 20px;
	}

	.salary-title-text {
		border-bottom: 8px solid #448ca5;
	}
	.salary-content>li {
		border-top: 4px solid #448ca5;
		border-bottom: 8px solid #448ca5;
	}
}
/* --------------------------------------------------
 * タブレット
-------------------------------------------------- */
@media(min-width:641px) and (max-width:1024px) {
}
/* --------------------------------------------------
 * PC
-------------------------------------------------- */
@media(min-width:1025px) {
}

/* --------------------------------------------------
 * common
-------------------------------------------------- */
.cf:after, .clearfix:after {
	display: block;
	clear: both;
	content: "";
}