@charset "utf-8";
/* ------------------------------------------------------------ common */

body {
	opacity: 0;
	transition: 1s;
	min-width: 1400px;
	padding: 0 0;
	width: 100%;
	overflow: scroll;
}

a:hover:hover,
a:hover img:hover,
input[type="submit"]:hover {
	opacity: 0.8;
	transition: 0.1s;
}


.inner {
	width: 1100px;
	margin: 0 auto;
}

.SP {
	display: none !important;
}
.s_inner { width: 1000px; margin: 0 auto;}
.m_inner { width: 1320px; margin: 0 auto;}
.max_inner { max-width: 1600px; margin: 0 auto; position: relative;}



/* ------------------------------------------------------------ header */

header { position: fixed; top: 0; left: 0; width: 100%; min-width: 1400px; padding: 36px 33px 20px; z-index: 20; transition: 0.5s;}
header.other { background: #fff;}
header.top.change-color { background: #111a41;}
header h1 { }
header .hamburger { position: absolute; top: 45px; right: 43px; width: 80px; height: 32px; cursor: pointer;}
header .hamburger span { position: absolute; display: inline-block; height: 2px; background: #535353; transition: 0.5s;}
header.top.change-color .hamburger span { background: #fff;}

header .hamburger span:nth-child(1) { width: 70px; top: 0;}
header .hamburger span:nth-child(2) { width: 80px; top: 15px;}
header .hamburger span:nth-child(3) { width: 50px; bottom: 0;}

/* ------------------------------------------------------------ modal */

#modalArea { position: fixed; width: 100%; height: 100vh; box-sizing: border-box; z-index: 70; top: 0; display: none;}
#modalArea .modal_menu { position: absolute; right: 0; width: 500px; height: 100%; background: #111a41; padding: 145px 0 100px; color: #fff; overflow-y: scroll;}
#modalArea .modal_menu .hamburger { position: absolute; width: 42px; height: 22px; cursor: pointer; z-index: 99; top: 47px; right: 55px;}
#modalArea .modal_menu .hamburger span { position: absolute; display: block; width: 100%; height: 2px; background-color: #000; transition: 0.5s;}
#modalArea .modal_menu .hamburger span:nth-of-type(1) { top: 0; transform: translate(0%,10px) rotate(45deg); background-color: #fff;}
#modalArea .modal_menu .hamburger span:nth-of-type(2) { bottom: 0; transform: translate(0%,-10px) rotate(-45deg); background-color: #fff;}

#modalArea .modal_menu a:hover { color: inherit;}

#modalArea .m_inner { width: 400px; margin: 0 auto;}
#modalArea h2 { margin-bottom: 100px; text-align: center;}
#modalArea ul { margin-bottom: 100px;}
#modalArea li { font-size: 30px; margin-bottom: 50px;}
#modalArea li a { color: #fff; font-family: 'Noto-Sans-JP-Medium'; line-height: 1.4;}


/* ------------------------------------------------------------ footer */

.footer { background: url(../images/common/footer/bg_footer.png?v=240726) no-repeat center top /cover; padding: 290px 0 115px;}
.footer nav { margin-bottom: 80px;}
.footer nav h3 { width: 400px; margin-bottom: 40px;}
.footer nav h3 a { }
.footer nav .lower { display: flex; justify-content: space-between;}
.footer nav .lower a { font-size: 18px; color: #fff; letter-spacing: 0.05em; text-shadow: 2.571px 3.064px 3px rgba(28, 53, 92, 0.2);}
.footer .legalinfo { text-align: right;}
.footer .legalinfo .flex { margin-bottom: 25px; display: flex; align-items: center; justify-content: flex-end;}
.footer .legalinfo .flex a { font-size: 13px; color: #fff; letter-spacing: 0.05em;}
.footer .legalinfo .flex .min { margin-right: 22px;}
.footer .legalinfo .flex .min a:first-child { margin-right: 0.7em; padding-right: 0.7em; border-right: 1px solid #fff;}
.footer .legalinfo .copyright { font-size: 13px; color: #fff;}





/* ------------------------------------------------------------ etc */
 body .btn { position: relative; display: block; width: 300px; padding: 25px 0; background: #111a41; font-size: 20px; color: #fff; font-family: "goldenbook", serif; font-weight: 400; font-style: normal; text-align: center;}
.btn:after { position: absolute; right: 0; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); display: block; content: ""; background: #dcdcdc; width: 50px; height: 1px;}

.h3_property { position: relative; top: -5px; font-size: 40px; font-family: 'Noto-Sans-JP-Medium';}
.h3_property span { font-family: "goldenbook", serif; font-weight: 400; font-style: normal;}
.h3_property .big { position: absolute; bottom: 63px; font-size: 120px; color: rgb(17 26 65 / 0.1); white-space: nowrap;}
.h3_property .small { display: block; font-size: 30px; color: #111a41; margin-bottom: 22px;}

.fortop { padding: 100px 0; }
.fortop .btn { color: #fff; margin: 0 auto;}


#bread ol { padding: 20px 0 0; list-style: none; margin-bottom: 30px;}
#bread ol li { display: inline; font-family: 'Noto-Sans-JP-Regular'; font-size: 14px; color: #707070;}
#bread ol li+li { font-weight: bold;}
#bread ol li+li:before { content: ''; display: inline-block; width: 5px; height: 2px; background: #707070; margin: 4px;}
#bread ol li a { color: #707070; text-decoration: none;}
#bread ol li a:hover { text-decoration: underline;}

.cookie {
	position: relative;
	height: 60px;
	padding: 10px;
	background: #333;
}

.cookie .left {
	width: calc(100% - 110px);
	float: left;
	font-size: 12px;
	line-height: 17px;
	color: #fff;
}

.cookie .left a{
	color: #fff;
	text-decoration: underline;
}

.cookie .right {
	width: 110px;
	float: left;
	text-align: right;
}

.cookie .right input[type="submit"] {
	width: 81px;
	font-size: 12px;
	line-height: 41px;
	color: #fff;
	background: none;
	border: 1px solid #e5e5e5;
	text-align: center;
	transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
}

.cookie .right button:hover {
	background: #fff;
	color: #000;
}

span.newtitle{
	float: left;
    display: block;
    font-size: 12px;
    line-height: 16px;
    background: rgba(235,92,2,0.8);
	color: white;
    margin: 0 10px 10px;
    padding: 4px 13px;
    border-radius: 5px;
    box-sizing: border-box;
}




/* ------------------------------------------------------------ mobile ------------------------------------------------------------ */

@media only screen and (max-width:768px) {
	.inner {
		width: 90%;
		margin: 0 auto;
	}
	.s_inner,
	.m_inner { width: 90%;}
	body {
		min-width: 100%;
		max-width: 100%;
		padding: 0 0;
	}
	.PC {
		display: none !important;
	}
	.SP {
		display: block !important;
	}

	#company .banner h2 {
		font-size: 16px!important;
	}
	#company .banner h2 span {
		font-size: 30px;
		line-height: 40px;
	}
	.flex{
		flex-direction: column;
	}
	/* ------------------------------------------------------------ header */
	
	header { position: fixed; top: 0; left: 0; width: 100%; min-width: auto; padding: 10px 15px 10px;}
	header h1 { width: 150px;}
	header .hamburger { top: 20px; right: 20px; width: 50px; height: 20px; cursor: pointer;}
	header .hamburger span { }
	header .hamburger span:nth-child(1) { width: 40px; top: 0;}
	header .hamburger span:nth-child(2) { width: 50px; top: 8px;}
	header .hamburger span:nth-child(3) { width: 30px; bottom: 0;}
	
	
	/* ------------------------------------------------------------ modal */
	
	#modalArea { z-index: 70; top: 0; display: none;}
	#modalArea .modal_menu { position: absolute; right: 0; width: 100%; padding: 100px 0 50px;}
	#modalArea .modal_menu .hamburger { width: 42px; height: 42px; top: 15px; right: 25px;}
	#modalArea .modal_menu .hamburger span { position: absolute; display: block; width: 100%; height: 2px; background-color: #000; transition: 0.5s;}
	#modalArea .modal_menu .hamburger span:nth-of-type(1) { top: 10px;}
	#modalArea .modal_menu .hamburger span:nth-of-type(2) { bottom: 10px;}
		
	#modalArea .m_inner { width: 90%; margin: 0 auto;}
	#modalArea h2 { margin-bottom: 60px; text-align: center;}
	#modalArea ul { margin-bottom: 100px;}
	#modalArea li { font-size: 24px; margin-bottom: 50px;}
	#modalArea li a { }
	



	/* ------------------------------------------------------------ footer */

	.footer { background: url(../images/common/footer/bg_footer.png?v=240726) no-repeat center top /cover; padding: 140px 0 30px;}
	.footer nav { display: block; margin-bottom: 80px;}
	.footer nav h3 { width: 300px; margin-bottom: 30px;}
	.footer nav h3 a { }
	.footer nav .lower { width: auto; display: block;}
	.footer nav .lower a { display: block; width: 100%; font-size: 16px; margin-bottom: 20px;}
	.footer .legalinfo { text-align: center;}
	.footer .legalinfo .flex { margin-bottom: 25px; flex-flow: column-reverse;}
	.footer .legalinfo .flex a { font-size: 13px; color: #fff; letter-spacing: 0.05em;}
	.footer .legalinfo .flex .min { margin-right: 0; padding-top: 20px;}
	.footer .legalinfo .flex .min a:first-child { margin-right: 0.7em; padding-right: 0.7em; border-right: 1px solid #fff;}
	.footer .legalinfo .copyright { font-size: 10px; line-height: 130%;}


	/* ------------------------------------------------------------ etc */
	
	.btn { width: 80%; padding: 18px 0; font-size: 15px;}
	.btn:after { width: 30px; height: 1px;}
	.fortop { padding: 50px 0; }
	
	.box .half .btn { width: 80%; margin: 0 auto;}
	.box .half .btn:after { }
	
	.h3_property { top: -5px; font-size: 24px;}
	.h3_property span { }
	.h3_property .big { bottom: 63px; font-size: 60px;}
	.h3_property .small { font-size: 16px; margin-bottom: 22px;}
		
	#bread ol { padding: 12px 0 0;}
	#bread ol li { font-size: 10px; line-height: 18px;}
	#bread ol li+li:before { margin: 4px 8px 2px 4px;} 
}