:root {
	--oc-link-color: #0d6efd;
	--oc-primary-color: #233b68;
	
	--oc-btn-primary-color: #233b68;
	--oc-btn-alt-color: #233b68;

	--oc-blog-heading-mt: 1.9rem;
	--oc-blog-heading-mb: 1.625rem;
	--oc-blog-heading-pt: 1.625rem;
	--oc-blog-font-size: calc(1rem + .069vw);
	--oc-blog-heading1-fs: calc(1.6rem + .069vw);
	--oc-blog-heading2-fs: calc(1.5rem + .069vw);
	--oc-blog-heading3-fs: calc(1.35rem + .069vw);
	--oc-blog-heading4-fs: calc(1.1rem + .069vw);
	--oc-blog-line-height: 1.625rem;
}

body {
	font-size: 16px;
	line-height: 1.8;
}

.text-primary-color{
	color: var(--oc-primary-color);
}
.clear-fix { clear: both; }

a {
	text-decoration: none;
	color: var(--oc-link-color);;
}
a:hover {
	text-decoration: none;
}
img {
	max-width: 100%;
}

.bg-image {
	z-index: 0;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.text-bg-top {
	z-index: 0;
	height: 200px;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}
.text-bg-top .caption {
}
.text-bg-top .caption h1,
.text-bg-top .caption h2 {
	color: #fff;
	font-size: 2rem;
	font-weight: bold;
	text-align: center;
}

.content-none {
    text-align: center;
    font-size: 20px;
    padding: 80px 10px;
}
.content-none .error-number {
    font-size: 70px;
}
.content-none .content-none-btn {
    margin: 20px auto;
    text-align: center;
}

/* OC Button Style */
.site-btn {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 375px;
    height: 73px;
    max-width: 90%;
    border: 1px solid #fff;
    color: #fff;
    background-color: transparent;
    transition: all 0.5s;
}
.site-btn {
    color: var(--oc-primary-color);
    border-color: var(--oc-primary-color);
}

/* END - OC Button Style */

.swiper-button-next, .swiper-rtl .swiper-button-prev {
	right: 17px;
}
.swiper-button-prev, .swiper-rtl .swiper-button-next {
	left: 21px;
}

.box_17_txt {
	padding-top: 2.2em!important;
}
.box_16_txt {
	padding-top: 0.5em!important;
}


footer#footer #footer-in{
	width: 100%;
}

@media screen and (min-width: 2310px){
    .swiper-button-next, .swiper-rtl .swiper-button-prev  {
        right: 440px;
    }
    .swiper-button-prev, .swiper-rtl .swiper-button-next {
        left: 430px;
    }
}
@media screen and (min-width: 2090px) and (max-width: 2309px) {
 .swiper-button-next, .swiper-rtl .swiper-button-prev  {
        right: 300px;
    }
    .swiper-button-prev, .swiper-rtl .swiper-button-next {
        left: 290px;
    }
}
@media screen and (min-width: 1900px) and (max-width: 2089px) {    
	.swiper-button-next, .swiper-rtl .swiper-button-prev  {
        right: 200px;
    }
    .swiper-button-prev, .swiper-rtl .swiper-button-next {
        left: 190px;
    }
}
@media screen and (min-width: 1800px) and (max-width: 1899px) {
    .swiper-button-next, .swiper-rtl .swiper-button-prev  {
        right: 100px;
    }
    .swiper-button-prev, .swiper-rtl .swiper-button-next {
        left: 90px;
    }
}


@media screen and (min-width: 1700px) and (max-width: 1799px) {
	.swiper-button-next, .swiper-rtl .swiper-button-prev  {
        right: 50px;
    }
    .swiper-button-prev, .swiper-rtl .swiper-button-next {
        left: 45px;
    }
	
}
@media screen and (min-width: 1600px) and (max-width: 1699px) {
	.swiper-button-next, .swiper-rtl .swiper-button-prev  {
        right: 30px;
    }
    .swiper-button-prev, .swiper-rtl .swiper-button-next {
        left: 20px;
    }
	
}

@media screen and (min-width: 1500px) and (max-width: 1699px) {
	.swiper-button-next, .swiper-rtl .swiper-button-prev  {
        right: 40px;
    }
    .swiper-button-prev, .swiper-rtl .swiper-button-next {
        left: 50px;
    }
}
@media screen and (min-width: 1400px) and (max-width: 1499px) {
	.swiper-button-next, .swiper-rtl .swiper-button-prev  {
        right: 23px;
    }
    .swiper-button-prev, .swiper-rtl .swiper-button-next {
        left: 25px;
    }
}
@media screen and (max-width: 1270px) {
	.swiper-button-next, .swiper-rtl .swiper-button-prev {
		right: 15px;
	}
}




#experience-section .swiper-button-prev:after, #experience-section .swiper-button-next:after {

}

/* OC Modal Style */
.modal-design {
	height: 80vh;
	overflow: scroll;
	margin: 15% 0 10% 0;
	border-radius: unset;
} 
.modal-dialog{
	max-width: 800px;
	padding: 1rem;
}

@media (min-width: 576px){
	.modal-dialog {
		max-width: 500px;
		margin: 1.75rem auto;
	}
}

.close-btn {
	position: fixed;
	right: 0x;
	top: 25px;
}
.modal-side-margin {
	margin: 0;
}

.modal-body-design {
	padding: 0;
}

.round_btn {
	display: block;
	width: 45px;
	height: 45px;
	border: 2px solid #AA8400; /* 枠の調整 */
	border-radius: 50%;  /* 丸みの度合い */
	background: #fff; /* ボタンの背景色 */
}

.round_btn::before, .round_btn::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 3px; /* 棒の幅（太さ） */
	height: 22px; /* 棒の高さ */
	background: #AA8400; /* バツ印の色 */
}

.round_btn::before {
	transform: translate(-50%,-50%) rotate(45deg);
}

.round_btn::after {
	transform: translate(-50%,-50%) rotate(-45deg);
}

/* END - OC Modal Style */