@charset "UTF-8";

/*=============================================================
#company
=============================================================*/

@media screen and (min-width: 769px) {

	#company {
		z-index: 0;
    	position: relative;
	}
	
	#company .catchcopy {
		font-size: clamp(2.0rem,2.4vw,2.8rem);
		color: #cb8054;
		font-weight: bold;
	}
	
	#company .catchcopy + p {
		font-size: 1.8rem;
		margin-top: 1em;
	}
	
	#company .bg_wrap {
		background-color: #eaeaea;
		padding: min(7.0vw,100px) 0;
		margin-top: min(7.0vw,100px);
		position: relative;
		z-index: -1;
	}
	
	#company .bg_wrap .box {
		background-color: #fff;
		padding: min(7.0vw,100px);
		box-sizing: border-box;
		position: relative;
		margin-top: min(7.0vw,100px);
	}
	#company .bg_wrap .box:first-child {
		margin-top: 0;
	}
	
	#company .bg_wrap .box::before,
	#company .bg_wrap .box::after {
		content: "";
		position: absolute;
		width: min(3vw,42px);
		height: min(3vw,42px);
		background-color: #d28054;
		z-index: -1;
	}
	
	#company .bg_wrap .box::before {
		bottom: calc(100% - min(1.5vw,21px));
    	right: calc(100% - min(1.5vw,21px));
	}
	
	#company .bg_wrap .box::after {
		top: calc(100% - min(1.5vw,21px));
    	left: calc(100% - min(1.5vw,21px));
	}
	
	#company .bg_wrap .box .letter {
		width: 50%;
		position: absolute;
		top: -2px;
		right: -2px;
	}
	
	#company .bg_wrap .box .en_hd {
		font-size: clamp(1.6rem,1.71vw,2.0rem);
		color: #cb8054;
		padding-left: 10em;
		position: relative;
	}
	
	#company .bg_wrap .box .en_hd::before {
		content: "";
		position: absolute;
		width: 9em;
		border: 1px solid #cb8054;
		top: 50%;
		left: 0;
	}
	
	#company .bg_wrap .box h2 {
		display: inline-block;
		font-size: clamp(2.0rem,2.6vw,3.0rem);
		font-weight: bold;
		margin-top: 1em;
		position: relative;
		z-index: 2;
	}
	
	#company .bg_wrap .box dl.table {
		width: 80%;
		margin: min(5.6vw,80px) auto 0;
		display: flex;
		flex-wrap: wrap;
	}
	
	#company .bg_wrap .box dt {
		width: 10em;
		font-size: 1.8rem;
		font-weight: bold;
		color: #1a1a1a;
		padding: 1em;
		background-color: #ffeddc;
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-top: 10px;
		box-sizing: border-box;
	}
	#company .bg_wrap .box dd {
		width: calc(100% - 10em);
		font-size: 1.8rem;
		display: flex;
		align-items: center;
		box-sizing: border-box;
		margin-top: 10px;
		padding-left: 2em;
	}

	#company .bg_wrap .box dd.url a {
		color: #5b8b55;
		text-decoration: underline;
	}
	
	#company .bg_wrap .box dd .tel_wrap {
		padding: 1em 0;
	}
	
	section#contact.banner {
		margin-top: 0;
	}
}

@media screen and (min-width: 521px) and (max-width: 768px) {
	
	#company {
		z-index: 0;
    	position: relative;
	}
	
	#company .catchcopy {
		font-size: 2.2rem;
		color: #cb8054;
		font-weight: bold;
	}
	
	#company .catchcopy + p {
		font-size: 1.8rem;
		margin-top: 1em;
	}
	
	#company .bg_wrap {
		background-color: #eaeaea;
		padding: 60px 0;
		margin-top: 60px;
		position: relative;
		z-index: -1;
	}
	
	#company .bg_wrap .box {
		background-color: #fff;
		padding: 6vw 3vw;
		box-sizing: border-box;
		position: relative;
		margin-top: 60px;
	}
	#company .bg_wrap .box:first-child {
		margin-top: 0;
	}
	
	#company .bg_wrap .box::before,
	#company .bg_wrap .box::after {
		content: "";
		position: absolute;
		width: 3vw;
		height: 3vw;
		background-color: #d28054;
		z-index: -1;
	}
	
	#company .bg_wrap .box::before {
		bottom: calc(100% - 1.5vw);
    	right: calc(100% - 1.5vw);
	}
	
	#company .bg_wrap .box::after {
		top: calc(100% - 1.5vw);
    	left: calc(100% - 1.5vw);
	}
	
	#company .bg_wrap .box .letter {
		width: 55%;
		position: absolute;
		top: -2px;
		right: -2px;
	}
	
	#company .bg_wrap .box .en_hd {
		font-size: 1.6rem;
		color: #cb8054;
		padding-left: 5em;
		position: relative;
	}
	
	#company .bg_wrap .box .en_hd::before {
		content: "";
		position: absolute;
		width: 4em;
		border: 1px solid #cb8054;
		top: 50%;
		left: 0;
	}
	
	#company .bg_wrap .box h2 {
		display: inline-block;
		font-size: 2.2rem;
		font-weight: bold;
		margin-top: .5em;
		position: relative;
		z-index: 2;
	}
	
	#company .bg_wrap .box dl.table {
		width: 100%;
		margin: 40px auto 0;
		display: flex;
		flex-wrap: wrap;
	}
	
	#company .bg_wrap .box dt {
		width: 8em;
		font-size: 1.8rem;
		font-weight: bold;
		color: #1a1a1a;
		padding: 1em;
		background-color: #ffeddc;
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-top: 10px;
		box-sizing: border-box;
	}
	#company .bg_wrap .box dd {
		width: calc(100% - 8em);
		font-size: 1.8rem;
		display: flex;
		align-items: center;
		box-sizing: border-box;
		margin-top: 10px;
		padding-left: 2em;
	}

	#company .bg_wrap .box dd.url a {
		color: #5b8b55;
		text-decoration: underline;
	}
	
	#company .bg_wrap .box dd .tel_wrap {
		padding: 1em 0;
	}
	
	section#contact.banner {
		margin-top: 0;
	}
}

@media screen and  (max-width: 520px) {
	
	#company {
		z-index: 0;
    	position: relative;
	}
	
	#company .catchcopy {
		font-size: 2.25rem;
		color: #cb8054;
		font-weight: bold;
	}
	
	#company .catchcopy + p {
		font-size: 2.0rem;
		margin-top: 1em;
	}
	
	#company .bg_wrap {
		background-color: #eaeaea;
		padding: 50px 0;
		margin-top: 50px;
		position: relative;
		z-index: -1;
	}
	
	#company .bg_wrap .box {
		background-color: #fff;
		padding: 6vw 3vw;
		box-sizing: border-box;
		position: relative;
		margin-top: 50px;
	}
	#company .bg_wrap .box:first-child {
		margin-top: 0;
	}
	
	#company .bg_wrap .box::before,
	#company .bg_wrap .box::after {
		content: "";
		position: absolute;
		width: 3vw;
		height: 3vw;
		background-color: #d28054;
		z-index: -1;
	}
	
	#company .bg_wrap .box::before {
		bottom: calc(100% - 1.5vw);
    	right: calc(100% - 1.5vw);
	}
	
	#company .bg_wrap .box::after {
		top: calc(100% - 1.5vw);
    	left: calc(100% - 1.5vw);
	}
	
	#company .bg_wrap .box .letter {
		width: 60%;
		position: absolute;
		top: -2px;
		right: -2px;
	}
	
	#company .bg_wrap .box .en_hd {
		font-size: 1.75rem;
		color: #cb8054;
		padding-left: 4em;
		position: relative;
	}
	
	#company .bg_wrap .box .en_hd::before {
		content: "";
		position: absolute;
		width: 4em;
		border: 1px solid #cb8054;
		top: 50%;
		left: 0;
	}
	
	#company .bg_wrap .box h2 {
		display: inline-block;
		font-size: 2.25rem;
		font-weight: bold;
		margin-top: .5em;
		position: relative;
		z-index: 2;
	}
	
	#company .bg_wrap .box dl.table {
		width: 100%;
		margin: 25px auto 0;
		display: flex;
		flex-direction: column;
	}
	
	#company .bg_wrap .box dt {
		width: 100%;
		font-size: 2.0rem;
		font-weight: bold;
		color: #1a1a1a;
		padding: 1em;
		background-color: #ffeddc;
		display: flex;
		justify-content: space-between;
		align-items: center;
		box-sizing: border-box;
	}
	#company .bg_wrap .box dd {
		width: 100%;
		font-size: 2.0rem;
		padding: 1em;
		display: flex;
		align-items: center;
		box-sizing: border-box;
	}

	#company .bg_wrap .box dd.url a,
	#company .bg_wrap .box dd.tel a{
		color: #5b8b55;
		text-decoration: underline;
	}
	
	#company .bg_wrap .box dd .tel_wrap {
		padding: 1em 0;
	}
	
	#company .bg_wrap .box dd .tel_wrap p:last-of-type {
		margin-top: 1em;
	}
	
	section#contact.banner {
		margin-top: 0;
	}
}