@charset "UTF-8";

:root {
	--white: #fff;
	--black: #000;
	--gray: #444444;
	--key: #f1817a;
	--sky-blue: #6fccee;
}

/*上書き・打消し
---------------------------------------------------------- */
body {
	background-color: var(--white);
}
a {
	color: inherit;
	text-decoration: none;
}
img {
	height: auto;
}
.gnav {
	position: relative;
	z-index: 5;
}
@media screen and (min-width: 751px) {
	body {
		width: 100%;
		min-width: 1060px;
	}
	header {
    min-width: 1060px;
	}
	.link-img {
		transition: all 0.3s cubic-bezier(0.19, 0.64, 0.4, 0.89);
	}
	.link-img:hover {
		transform: scale(1.025);
	}
}

@media screen and (max-width: 750px) {
	img {
		width: 100%;
	}
	.sp_pt50 {
		padding-top: 50px!important;
	}
	.sp_pb40 {
		padding-bottom: 40px!important;
	}
	.sp_50per {
		width: 50%!important;
	}
}

/*アウトライン
---------------------------------------------------------- */
.o-wrapper {
	width: 100%;
	max-width: 1060px;
	margin-inline: auto;
	padding-inline: 20px;
}
.o-block-100 {
	padding: 100px 0;
}
.o-block-90 {
	padding: 90px 0;
}
.o-block-80 {
	padding: 80px 0;
}
.o-block-70 {
	padding: 70px 0;
}
.o-block-60 {
	padding: 60px 0;
}
.o-block-50 {
	padding: 50px 0;
}
.o-block-40 {
	padding: 40px 0;
}
.o-block-30 {
	padding: 30px 0;
}
.o-block-20 {
	padding: 20px 0;
}
.o-block-10 {
	padding: 10px 0;
}

@media screen and (min-width: 751px) {
	.o-block-100-pc {
		padding: 100px 0;
	}
	.o-block-90-pc {
		padding: 90px 0;
	}
	.o-block-80-pc {
		padding: 80px 0;
	}
	.o-block-70-pc {
		padding: 70px 0;
	}
	.o-block-60-pc {
		padding: 60px 0;
	}
	.o-block-50-pc {
		padding: 50px 0;
	}
	.o-block-40-pc {
		padding: 40px 0;
	}
	.o-block-30-pc {
		padding: 30px 0;
	}
	.o-block-20-pc {
		padding: 20px 0;
	}
	.o-block-10-pc {
		padding: 10px 0;
	}
	
}

@media screen and (max-width: 750px) {
	.o-wrapper {
		padding-inline: 4%;
	}
	.o-block-30vw-sp {
		padding: 30vw 0;
	}
	.o-block-25vw-sp {
		padding: 25vw 0;
	}
	.o-block-20vw-sp {
		padding: 20vw 0;
	}
	.o-block-15vw-sp {
		padding: 15vw 0;
	}
	.o-block-10vw-sp {
		padding: 10vw 0;
	}
	.o-block-5vw-sp {
		padding: 5vw 0;
	}
	.o-block-3vw-sp {
		padding: 3vw 0;
	}
}

/*共通
---------------------------------------------------------- */
.c-display-flex {
	display: flex;
}
.c-justify-content-c {
	justify-content: center;
}
.c-justify-content-sb {
	justify-content: space-between;
}
.c-align-items-c {
	align-items: center;
}
.c-flex-wrap-w {
	flex-wrap: wrap;
}

.c-z-index-1 {
	position: relative;
	z-index: 1;
}

.c-color-white {
	color: var(--white) !important;
}
.c-color-black {
	color: var(--black) !important;
}
.c-color-key {
	color: var(--key) !important;
}
.c-color-sub-key {
	color: var(--gray) !important;
}
.c-color-sky-blue {
	color: var(--sky-blue) !important;
}

.c-overflow-hidden {
	overflow: hidden;
}

.c-letter-spacing-m1 {
	letter-spacing: -1px;
}

.c-headline-lv2 {
	margin-bottom: 60px;
}
.c-youtube-embed {
	width: 100%;
	aspect-ratio: 16 / 9;
}
.c-youtube-embed iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: none;
}

.c-button {
	position: relative;
	display: block;
	width: 80%;
	max-width: 400px;
	min-height: 50px;
	margin-inline: auto;
	background-color: var(--sub-key2);
	border-radius: 1.5em;
	color: var(--white);
	font-size: 1.4em;
	line-height: 1;
	transition: all 0.3s cubic-bezier(0.19, 0.64, 0.4, 0.89);
}
.c-button__inner {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	min-height: inherit;
	padding: 15px 50px;
}

.c-list {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	margin: -15px 0 0 -15px;
}
.c-item {
	width: calc(100% / 3 - 15px);
	margin: 15px 0 0 15px;
	text-align: center;
}
.c-card-list {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin: -15px 0 0 -15px;
}
.c-card-item {
	width: calc(100% / 3 - 15px);
	margin: 15px 0 0 15px;
}
.c-card-name {
	display: block;
	font-size: 2.4rem;
	font-weight: 500;
	line-height: 1.2;
	text-align: center;
}
.c-card-item__detail {
	padding: 15px;
	background-color: var(--white);
}

@media screen and (min-width: 751px) {
	.c-display-flex-pc {
		display: flex;
	}
	.c-justify-content-c-pc {
		justify-content: center;
	}
	.c-align-items-c-pc {
		align-items: center;
	}
	.c-flex-wrap-w-pc {
		flex-wrap: wrap;
	}
	.c-button:hover {
		background-color: var(--sky-blue);
	}

}

@media screen and (max-width: 750px) {
	.c-display-flex-sp {
		display: flex;
	}
	.c-justify-content-c-sp {
		justify-content: center;
	}
	.c-align-items-c-sp {
		align-items: center;
	}
	.c-flex-wrap-w-sp {
		flex-wrap: wrap;
	}

	.c-headline-lv2 {
		margin-bottom: 5vw;
		display: inline-block;
	}
	.c-button {
		max-width: 90vw;
		min-height: 50px;
	}
	.c-button__inner {
		padding: 10px;
	}

	.c-list {
		margin: -15px 0 0 -15px;
	}
	.c-item {
		width: calc(50% - 15px);
		margin: 20px 0 0 15px;
		text-align: center;
	}
	.c-name {
		font-size: 1.8rem;
	}
	.c-role {
		font-size: 1.6rem;
	}

	.c-card-list {
		margin: -10px 0 0 -10px;
	}
	.c-card-item {
		width: calc(100% / 2 - 10px);
		margin: 10px 0 0 10px;
	}
	.c-card-name {
		font-size: 1.4rem;
		line-height: 1.3;
		text-align: center;
	}
	.c-card-genre {
		padding: 5px 15px;
		font-size: 1.2rem;
	}
}

/* loader
---------------------------------------------------------- */

.loader_container {
	width: 100%;
	height: 100dvh;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: hidden;
	z-index: 99999;
	background: url("../img/common/bg_ptn.png") cover center top;
}
.loader_container::after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100dvh;
	z-index: -1;
}

.loader {
	display: flex;
	position: absolute;
	top: calc(50% - 25px);
	left: calc(50% - 25px);
	width: 50px;
	height: 50px;
}

.loader div {
	position: absolute;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--sub-key2);
	animation: loader_scale 1.2s infinite, loader_fade 1.2s infinite;
	animation-timing-function: linear;
}

.loader div:nth-child(1) {
			animation-delay: 0.00s;
			top: 38px;
			left: 20px;
		}
.loader div:nth-child(2) {
			animation-delay: -0.15s;
			top: 33px;
			left: 33px;
		}
.loader div:nth-child(3) {
			animation-delay: -0.30s;
			top: 20px;
			left: 38px;
		}
.loader div:nth-child(4) {
			animation-delay: -0.45s;
			top: 7px;
			left: 33px;
		}
.loader div:nth-child(5) {
			animation-delay: -0.60s;
			top: 2px;
			left: 20px;
		}
.loader div:nth-child(6) {
			animation-delay: -0.75s;
			top: 7px;
			left: 7px;
		}
.loader div:nth-child(7) {
			animation-delay: -0.90s;
			top: 20px;
			left: 2px;
		}
.loader div:nth-child(8) {
			animation-delay: -1.05s;
			top: 33px;
			left: 7px;
		}

@media only screen and (min-width: 751px) {
	.loader_container {
		min-width: 1060px;
	}
}

@keyframes loader_scale {
	0%, 20%, 80%, 100% {
		transform: scale(1);
	}
	50% {
		transform: scale(1.6);
	}
}

@keyframes loader_fade {
	0%, 20%, 80%, 100% {
		opacity: 0.8;
	}
	50% {
		opacity: 1;
	}
}

/* container
---------------------------------------------------------- */
.container {
	width: 100%;
	position: relative;
	z-index: 1;
	text-align: center;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 1.5rem;
	letter-spacing: 1px;
	overflow: hidden;
	background-color: var(--white);
}
.container .txt_b {
	font-weight: 700;
}
.about {
	position: relative;
	background: url("../img/top/about_bg.png") no-repeat center top;
	background-size: cover;
}
.trailer {
	width: 100%;
	position: relative;
}
.trailer-parts01 {
	position: absolute;
	top: 2rem;
    right: 0;
}
.trailer-parts02 {
	position: absolute;
	bottom: -4rem;
    left: 0;
}
.sns {
	position: relative;
	background: url("../img/top/sns_bg.png") no-repeat center top;
	background-size: cover;
    clip-path: polygon(0 70px, 100% 0, 100% calc(100% - 70px), 0 100%);
}
.message {
	background: linear-gradient(0deg, rgb(218, 209, 203), rgb(255, 255, 255));
}
.contents-block {
	background: url("../img/common/bg_ptn.png") repeat center top;
	background-color:rgba(255,255,255,0.6);
	background-blend-mode:lighten;
}
.contents-inner {
	max-width: 1060px;
	margin-inline: auto;
}
.container .flex {
	flex-wrap: wrap;
	justify-content: space-between;
}
.container .flex_re {
	flex-direction: row-reverse;
}

@media only screen and (min-width: 751px) and (max-width: 1180px) {
	.container {
		min-width: 1060px;
		width: 100%;
	}
	.hero h1 img {
		width: 100%;
		height: auto;
	}
}
@media only screen and (max-width: 750px) {
	.container {
		overflow: hidden;
		font-size: 1.3rem;
	}
	.contents-block {
		padding: 0 3vw;
	}
	.trailer-parts01 {
		width: 50%;
		top: 1rem;
	}
	.trailer-parts02 {
		width: 50%;
		bottom: -1rem;
	}
	.sns {
		clip-path: polygon(0 30px, 100% 0, 100% calc(100% - 30px), 0 100%);
	}
}

/* hero-block
---------------------------------------------------------- */
@media only screen and (min-width: 751px) {
	.hero-block {
		min-width: 1060px;
		background: url("../img/common/hero_pc_bg.png") no-repeat center bottom;
		background-size: cover;
	}
}
@media only screen and (max-width: 750px) {
	.hero-block h1 img {
		max-width: initial;
		width: 100vw;
	}
}

/* nav
---------------------------------------------------------- */
.fr-nav {
	position: sticky;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	padding-inline: 20px;
	background-color: var(--white);
	z-index: 999;
}
.fr-nav ul {
	position: relative;
	width: 100%;
	height: 5em;
	margin-inline: auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.fr-nav ul li {
	width: 20%;
	height: 100%;
}
.fr-nav ul li a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	padding-inline: 1vw;
}

@media only screen and (min-width: 751px) {
	.fr-nav ul {
		max-width: 1100px;
	}
	.fr-nav ul li a:hover {
		filter: hue-rotate(160deg);
	}
	
}
@media only screen and (max-width: 750px) {
	.fr-nav {
		padding-inline: 1%;
	}
	.fr-nav ul {
		height: 4em;
	}
	.fr-nav ul li a img {
		height: 6vw;
		width: auto;
	}
}

/* footer
---------------------------------------------------------- */
.ft_contents {
	text-align: center;
	font-size: 1.2rem;
}
.ft_contents .c-button {
    position: relative;
    display: block;
    width: 80%;
    max-width: 400px;
    min-height: 50px;
    margin-inline: auto;
    background-color: var(--key);
    border-radius: 1.5em;
    color: var(--white);
    font-size: 1.4em;
    line-height: 1;
    transition: all 0.3s cubic-bezier(0.19, 0.64, 0.4, 0.89);
}
.ft_contents .c-button__inner {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	min-height: inherit;
	padding: 15px 50px;
}
footer {
	letter-spacing: 1px;
	color: var(--key);
}

@media only screen and (min-width: 751px) {
	.ft_contents {
		min-width: 1060px;
		width: 100%;
	}
	.ft_contents .c-button {
		margin-top: 30px;
	}
	.ft_contents .c-button__inner {
		padding: 20px 50px 15px;
	}
}
@media only screen and (max-width: 750px) {
	.ft_contents {
		padding: 0 3vw 4vw;
	}
	.ft_contents .c-button {
		margin-bottom: 15px;
	}
	footer {
		padding: 2vw 0 2vw;
	}
}

/* hero-block -------------------------------*/
.hero-txt-cast {
	margin-inline: auto;
}
.bnr-another {
	box-shadow: 0 0 14px 0 rgba(0, 0, 0, 0.1);
}
@media only screen and (min-width:1181px) {
	.top-hero-block h1 img {
		max-width: initial;
		width: 100vw;
	}
}
@media only screen and (min-width:751px) {
	.hero-catch {
		padding: 60px 0 80px;
	}
	.hero-txt-cast {
		margin-bottom: 60px;
		width: 90%;
	}
	.bnr_tver img {
		width: 400px;
	}
}
@media only screen and (max-width: 750px) {
	.hero-inner {
		padding: 0 0 10vw;
	}
	.hero-catch {
		padding: 6vw 4% 8vw;
	}
	.hero-txt-cast {
		margin-bottom: 40px;
	}
}
/* top-movie -------------------------------*/
.top-movie-embed {
	position: relative;
	text-align: -webkit-center;
}
.movie-link {
	width: 32%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.movie-link.link3 li {
	margin: 0 0 9px;
}
.movie-link.link4,
.movie-link.link5 {
	margin-bottom: -12px;
}
.movie-link.link4 li,
.movie-link.link5 li {
	width: 49%;
}
.movie-link.link7 {
	justify-content: flex-start;
	margin: 0 0 -12px -1%;
}

.movie-link.link7 li {
	width: 32%;
	margin: 0 0 12px 1%;
}

@media only screen and (min-width:751px) {
	.top-movie-embed {
		width: 66.3%;
		margin-inline: auto;
	}
	.movie-link.link3 li:last-child {
		margin: 0;
	}
	.movie-link.link7 li.link7-w3 {
		width: 98%;
	}
}

@media only screen and (max-width: 750px) {
	.top-movie-embed {
		width: 100%;
	}
	#trailer .c-youtube-embed {
		margin-top: 13px;
	}
	#trailer .movie-link {
		padding: 20px 0 0;
		width: 100%;
	}
	.movie-link {
		padding: 10px 0;
		width: 100%;
	}
	.movie-link.link7 {
		width: 100%;
	}
	.movie-link.link3 li {
		max-width: 340px;
		width: 32%;
		margin: 2px;
	}
	.movie-link.link4 li,
	.movie-link.link7 li {
		width: 24%;
	}
	.movie-link.link5 li {
		width: 19%;
	}
}

/* sns -------------------------------*/

.sns-block ul {
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.sns-block ul li {
	margin: 0 2px
}
@media only screen and (min-width: 751px) {
	.sns-block {
		width: 600px;
		margin: 0 auto;
	}
	.sns-block ul li {
		padding-bottom: 20px;
	}
}

@media only screen and (max-width: 750px) {
	.sns-block ul li {
		padding-bottom: 3vw;
		margin: auto;
	}
}


/* intro
---------------------------------------------------------- */
#introduction {
	font-size: 1.6rem;
	text-align: center;
}
#introduction .contents-inner p {
	max-width: 810px;
	margin: 0 auto 25px;
	color: var(--gray);
}

@media only screen and (max-width: 750px) {
	#introduction {
		font-size: 1.4rem;
		text-align: left;
	}
}



/* story
---------------------------------------------------------- */

#story p {
	color: var(--gray);
	font-family: sans-serif;
}
#story .contents-inner p {
	font-size: 1.6rem;
	line-height: 1.8;
	text-align: center;
}
#story .contents-inner p.t_right {
	padding-top: 30px;
	font-size: 1.4rem;
}

@media only screen and (max-width: 750px) {
	#story .contents-inner p {
		font-size: 1.4rem;
		text-align: left;
	}
	#story .contents-inner p.t_right {
		font-size: 1.3rem;
		padding-top: 20px;
	}
}

@media only screen and (max-width: 320px) {
	#introduction .contents-inner p,
	#story .contents-inner p {
		margin-bottom: 10px;
		font-size: 1.3rem;
	}
}

/* loopslider
------------------------------------- */
#loopslider {
	width: 100vw;
	height: 280px;
	text-align: left;
	position: relative;
	overflow: hidden;
}
#loopslider ul {
	height: 280px;
	display: inline-block;
	overflow: hidden;
}
#loopslider ul ::after {
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
}
#loopslider ul li {
	width: 496px;
	height: 280px;
	float: left;
	display: inline;
	overflow: hidden;
}
@media only screen and (min-width: 751px) and (max-width: 1180px) {
	#loopslider {
		width: calc(100% + 40px);
		margin-inline: -20px;
	}	
}
@media only screen and (max-width: 750px) {
	#loopslider {
		max-height: 140px;
	}
	#loopslider ul li {
		max-width: 248px;
		height: auto;
	}
}


/* 装飾
---------------------------------------------------------- */
.brackets {
	position: relative;
	padding: 60px;
}
.brackets::before {
	content: url(../img/common/brackets_t_pc.png);
	position: absolute;
	left: 0;
	top: 0;
}
.brackets::after {
	content: url(../img/common/brackets_b_pc.png);
	position: absolute;
	right: 0;
	bottom: 0;
}

@media only screen and (max-width: 750px) {
	.brackets {
		padding: 30px;
	}
	.brackets::before {
		content: url(../img/common/brackets_t_sp.png);
		position: absolute;
		left: 0;
		top: 0;
	}
	.brackets::after {
		content: url(../img/common/brackets_b_sp.png);
		position: absolute;
		right: 0;
		bottom: 0;
	}
}

/* cast
---------------------------------------------------------- */
.cast_box {
	border-radius: 20px;
	letter-spacing: .5px;
	color: var(--gray);
	text-align: left;
}
.cast_pht {
	width: 40%;
}
.cast_prof {
	width: 56%;
}
.cast_prof.wide {
	width: 100%;
}
.cast_message {
	width: 100%;
	margin-top: 20px;
	padding-top: 20px;
	border-top: 1px solid var(--sky-blue);
}
.cast_box h3 {
	display: flex;
	align-items: center;
	margin-bottom: 15px;
	color: var(--sky-blue);
}
.cast_name {
	padding: 0 1rem;
	font-weight: 700;
	font-size: 4rem;
}
.cast_name small {
	font-size: .7em;
}
.cast_name_sub {
	padding: 5px 0 0;
	font-size: 1.4rem;
	font-weight: 700;
}
.cast_name_roma {
	padding: 5px 0 0;
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 1.4rem;
}
.cast_box h4 {
	margin: 5px auto 15px;
	font-family: 'Lato', sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 2rem;
	color: var(--sky-blue);
}
.cast_box_wrapper {
	padding: 80px;
}
#sub .cast_box {
	padding-top: 60px;
	padding-left: 80px;
	padding-right: 80px;
}
.cast_prof p {
	margin-top: 10px;
}
.sub_list {
	width: 80%;
	margin: 0 auto;
	text-align: center;
}
.sub_list li {
	padding: 0 10px;
	display: inline-block;
}
.sub_list li span {
	font-weight: 700;
	color: #c78211;
}
.sns_flex_pc,
.sns_flex {
	margin: 10px 0;
	display: flex;
}
.sns_flex a {
	display: inline-block;
	margin-right: 10px;
	height: 48px;
}
.sns_flex img {
	height: 48px;
}
.sub_block ul li p {
	margin: 5px 0 0;
}

@media only screen and (min-width: 751px) {
	.sub_block ul {
		display: flex;
		justify-content: center;
		text-align: center;
	}
	.sub_block ul li {
		margin: 0 20px 0;
	}
}

@media only screen and (max-width: 750px) {
	#sub h2.ttl {
		padding-bottom: 20px;
	}
	#sub h2.ttl img {
		width: 90%;
	}
	.cast_box {
		padding: 0;
		border-radius: 20px;
	}
	.cast_pht,
	.cast_prof {
		width: 100%;
	}
	.cast_message {
		margin-top: 10px;
		padding-top: 10px;
	}
	.cast_box_wrapper {
		padding: 40px;
	}
	.cast_box h3 {
		margin: 10px 0;
		display: block;
	}
	.cast_box h3 span {
		display: inline-block;
		letter-spacing: 0;
	}
	.cast_name {
		padding: 0 .5rem;
		font-size: 2rem;
	}
	#cast03 .cast_name {
		padding: 0 .3rem;
	}
	.cast_name_sub,
	.cast_name_roma {
		font-size: 1rem;
	}
	.ls {
		letter-spacing: -2px!important;
	}
	.cast_box h4 {
		margin: 0 0 10px;
		font-size: 1.6rem;
	}
	
	#sub .cast_box_wrapper {
		padding: 20px;
	}
	#sub .cast_box {
		padding: 20px;
	}
	.sub_block ul li {
		margin: 0 auto 20px;
		text-align: center;
		width: 100%;
	}
	.sub_list {
		width: 100%;
	}
	.sub_list li {
		display: block;
	}
	.sns_flex {
		height: 30px;
	}
	.sns_flex a,
	.sns_flex img {
		height: 30px;
	}
}

/* staff
---------------------------------------------------------- */
#staff .contents-inner {
	padding-bottom: 0;
}
#staff_list {
	border-bottom: 1px solid var(--sky-blue);
	font-size: 1.3rem;
	text-align: left;
	color: #404040;
}
.list_box {
	padding: 40px 0;
	border-bottom: 1px solid var(--sky-blue);
}
.list_box:last-of-type {
	border: none;
}
.list_box dt,
.list_box dd {
	display: inline-block;
	padding: 3px 0;
	vertical-align: text-top;
	letter-spacing: 0;
}
.list_box dt {
	width: 15rem;
	font-weight: bold;
	color: var(--gray);
}
.list_box dd {
	color: var(--black);
}
.list_box dt.logo {
	width: auto!important;
	margin-right: 20px;
}
.list_box dt.long {
	line-height: 1;
}
.list_box dt span {
	display: inline-block;
}
.list_box dd {
	width: calc(100% - 16rem);
}
.dt_w7 dt {
	width: 7rem;
}
.dt_w7 dd {
	width: calc(100% - 8rem);
}
.dt_w8 dt {
	width: 8rem;
}
.dt_w8 dd {
	width: calc(100% - 9rem);
}
.dt_w11 dt {
	width: 10rem;
}
.dt_w11 dd {
	width: calc(100% - 20rem);
}
.dt_w12 dt {
	width: 12rem;
}
.dt_w12 dd {
	width: calc(100% - 13rem);
}
.dt_w13 dt {
	width: 13rem;
}
.dt_w13 dd {
	width: calc(100% - 14rem);
}
.dt_w15 dt {
	width: 15rem;
}
.dt_w15 dd {
	width: calc(100% - 16rem);
}
.dt_w16 dt {
	width: 16rem;
}
.dt_w16 dd {
	width: calc(100% - 17rem);
}
.dt_w18 dt {
	width: 18rem;
}
.dt_w18 dd {
	width: calc(100% - 19rem);
}
.nobreak {
	display: inline-block;
}
.nobreak img {
	width: auto;
	height: 30px;
}
.logotype img {
	width: auto;
	height: 10px;
	margin: 0 5px 2px;
}
.company_logo img {
	max-width: 180px;
}

@media all and (-ms-high-contrast: none) {
	.nobreak {
		padding-right: 1.3rem;
	}
}

@media only screen and (min-width: 751px) {
	.list_box {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.col_1 dl {
		width: 100%;
	}
	.col_2 dl:first-of-type {
		width: 45%;
	}
	.col_2 dl:last-of-type {
		width: 54%;
	}
	.col_3 dl {
		width: 30%;
	}
	.col_3.adjust dl {
		width: 33%;
		position: relative;
	}
	.col_3.adjust dl:first-of-type {
		width: 33%;
	}
	.dt_w12 dt {
		line-height: 1.4;
	}
	.pc_br {
		display: inline-block;
	}
	.director {
		position: absolute;
		bottom: 15px;
		left: 0;
	}
	dd.director {
		left: 13rem;
	}
}

@media only screen and (max-width: 750px) {
	#staff {
		background-size: cover;
	}
	.col_2 dl,
	.col_3 dl {
		width: 100%;
	}
	#staff_list {
		border-top: 1px solid var(--white);
	}
	.list_box {
		border-bottom: 1px solid var(--white);
	}
	.list_box dt,
	.list_box dd {
		padding: 0;
		width: 100%;
		display: block;
	}
	.list_box dt,
	.list_box dt.mb15 {
		margin-top: 5px;
		margin-bottom: 0 !important;
	}
	.list_box dd {
		padding-left: 1.3rem;
	}
	.sp_br {
		display: inline-block;
	}
	dt.director {
		padding-top: 20px;
	}
}

.bg-w {
	background-color: rgba(255, 255, 255, 0.7);
	border-radius: 20px;
}
@media only screen and (max-width: 750px) {
	.bg-w {
		border-radius: 20px;
	}
}