@charset "utf-8";
/* CSS Document */

/************************************************************************************
MODIFICATION
*************************************************************************************/
#subintro {
	background-image:url(../images/ca/intro_bg.png);
}
@media only screen and (max-width: 1039px){
	#subintro {
		background-image:url(../images/ca/intro_bg_sp.png);
	}
}
.fs30 {
	font-size:30px;
}
@media only screen and (max-width: 1039px){
	.fs30 {
		font-size:25px;
	}
}
/************************************************************************************
SUB PAGE GENERAL
*************************************************************************************/
h2 {
	font-size:40px;
	font-weight:600;
	line-height:150%;
	letter-spacing:3px;
	margin-bottom:50px;
}
p {
	font-size:15px;
	font-weight:600;
	line-height:125%;
	letter-spacing:2px;
}

@media only screen and (max-width: 1039px){
	h2 {
		font-size:25px;
		margin-bottom:20px;
	}
	p {
		font-size:13px;
	}
}

/************************************************************************************
TOPWRAP
*************************************************************************************/
article#topWrap {
	margin-bottom:50px;
}
article#topWrap .tit_sub01 h1 span {
	left:460px;
}
@media only screen and (max-width: 1039px){
	article#topWrap {
		margin-bottom:95px;
	}
	article#topWrap .tit_sub01 h1 span {
		left:0;
	}
	article#topWrap section {
		padding:0 20px;
	}
}

/************************************************************************************
CAWRAP
*************************************************************************************/
article#caWrap {
	/*overflow:hidden;*/
}
/*　　　　　　　to_section　　　　　　　*/
div#to_section {
	width:650px;
	margin:0 auto;
	position:relative;
	left:-30px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
div#to_section img {
	height:400px;
	width:auto;
	display:inline-block;	
}
div.to_section_top a,
div.to_section_bottom a {
	position: relative;
}
div.to_section_top a:nth-child(1) {
	z-index: 1;
}
div.to_section_top a:nth-child(2) {
	margin-top:0px;
	margin-left:-45px;
	z-index: 2;
}
div.to_section_top a:nth-child(3) {
	margin-top:0px;
	margin-left:-60px;
	z-index: 1;
}
div.to_section_top a:nth-child(4) {
	margin-top:0px;
	margin-left:-80px;
	z-index: 2;
}

.to_section_bottom {
	margin-top:-230px;
}
div.to_section_bottom a:nth-child(1) {
	margin-left:30px;
	z-index: 4;
}
div.to_section_bottom a:nth-child(2) {
	margin-left:-67px;
	z-index: 3;
}
div.to_section_bottom a:nth-child(2) img {
	height:390px !important; 
}
div.to_section_bottom a:nth-child(3) {
	margin-left:-15px;
	z-index: 3;
}

/*　　　　　　　ca_section　　　　　　　*/
#ca01section, 
#ca02section, 
#ca03section, 
#ca04section, 
#ca05section, 
#ca06section, 
#ca07section, 
#ca08section, 
#ca09section {
	padding-top:100px;
}
#ca09section {
	padding-bottom:15px;
}
article#caWrap section {
	padding:35px 0;
}
.ca01, .ca03, .ca05, .ca07 {
	background-color:#C40018;
}
.ca02, .ca04, .ca06 {
	background-color:#F4C500;
}
.catch, .status {
	padding:20px 18px;
	border:3px solid #000000;
	background-color:#FFFFFF;
}

/*      catch      */
.catch {
	width:416px;
	height:600px;
	position:relative;
}
.ca01 .catch, .ca03 .catch, .ca05 .catch, .ca07 .catch {
	float:left;
}
.ca02 .catch, .ca04 .catch, .ca06 .catch {
	float:right;
}
.catch h2 {
	font-size:10px;
	font-weight:600;
	letter-spacing:1px;
	margin-bottom:5px;
}
.ca01 h2, .ca03 h2,.ca05 h2, .ca07 h2 {
	color:#C40018;
}
.ca02 h2, .ca04 h2, .ca06 h2 {
	color:#F4C500;
}
.catch p {
	color:#FFFFFF;
	font-size:12px;
	font-weight:600;
	line-height:160%;
	margin-bottom:15px;
}
.catch p span {
	padding:2px 0;
}
.ca01 .catch p span, .ca03 .catch p span, .ca05 .catch p span, .ca07 .catch p span {
	background-color:#C40018;
}
.ca02 .catch p span, .ca04 .catch p span, .ca06 .catch p span {
	background-color:#F4C500;
}

.catch h3 {
	font-size:45px;
	font-weight:600;
}
.catch figure {
	width:100%;
}
.catch figure .area {
	width:174px;
	height:auto;
	position:absolute;
	bottom: 5px;
}
.catch figure .areaOsakaR {
	left:-11px;
}
.catch figure .areaOsakaY {
	left:-14px;
}
.catch figure .areaTokyoR {
	left:-15px;
}
.catch figure .areaTokyoY {
	left:-28px;
}
.catch figure .person {
	position:absolute;
	width:auto;
	height:759px;
	left:50px;
	top:-4px;
}
.catch figure .msg {
	position:absolute;
	height:auto;
}
.ca01 .catch figure .person {
	left:25px;
}
.ca01 .catch figure .msg {
	width:549px;
	left:-95px;
	top:265px;
}
.ca02 .catch figure .person {
	left:105px;
}
.ca02 .catch figure .msg {
	width:450px;
	left:-40px;
	top:250px;
}
.ca03 .catch figure .person {
	left:65px;
}
.ca03 .catch figure .msg {
	width:358px;
	left:-40px;
	top:255px;
}
.ca04 .catch figure .person {
	height: 820px;
	left: 45px;
	top: -65px;
}
.ca04 .catch figure .msg {
	width:574px;
	left:-40px;
	top:250px;
}
.ca05 .catch figure .person {
	height: 820px;
	left: 40px;
	top: -65px;
}
.ca05 .catch figure .msg {
	width:426px;
	left:-40px;
	top:250px;
}
.ca06 .catch figure .person {
	height: 820px;
	left: 20px;
	top: -85px
}
.ca06 .catch figure .msg {
	width:562px;
	left:-25px;
	top:250px;
}
.ca07 .catch figure .person {
	height: 870px;
	left: 20px;
	top: -152px
}
.ca07 .catch figure .msg {
	width:603px;
	left:-105px;
	top:255px;
}

/*      status      */
.status {
	width:575px;
	height:600px;
}
.ca01 .status, .ca03 .status, .ca05 .status, .ca07 .status {
	float:right;
}
.ca02 .status, .ca04 .status, .ca06 .status, .ca08 .status {
	float:left;
}
.status figure {
	text-align:center;
}
.status figure img {
	width:481px;
	height:auto;
	margin-left: 20px;
}
.status figure .profile {
	height: 190px;
	margin-top:25px;
	display: flex;
	align-items: center;
	text-align:left;
	border:3px solid #000000;
}
.status ul {
	padding:20px 0px 0 20px;
}
.status ul li {
	float:left;
	margin-bottom:15px;
}
.status ul li:nth-child(2) {
	margin-left:30px;
	margin-right:30px;
}
.status h4 {
	font-size:15px;
	font-weight:600;
}
.ca01 h4, .ca03 h4, .ca05 h4, .ca07 h4 {
	color:#9F0013;
}
.ca02 h4, .ca04 h4, .ca06 h4 {
	color:#F4C500;
}
.status p {
	font-size:20px;
	font-weight:600;
}

.spNone_ca {
	display:inherit;
}
.pcNone_ca {
	display:none;
}
@media only screen and (max-width: 1023px){
	.spNone_ca {
		display:none !important;
	}
	.pcNone_ca {
		display:inherit;
	}
}
@media only screen and (max-width: 1249px){
	.status {
		width:560px;
		height:600px;
	}
	.catch {
		width:400px;
		height:600px;
		position:relative;
	}
	.ca01 .catch figure .msg {
		width: calc(549px * 0.9);
		left:-65px;
		top:260px;
	}
	.ca02 .catch figure .msg {
		width: calc(450px * 0.9);
		top:245px;
	}
	.ca03 .catch figure .msg {
		width: calc(358px * 0.9);
		left:-30px;
		top:250px;
	}
	.ca04 .catch figure .msg {
		width: calc(574px * 0.9);
		left:-40px;
		top:245px;
	}
	.ca05 .catch figure .msg {
		width: calc(426px * 0.9);
		left:-40px;
		top:245px;
	}
	.ca06 .catch figure .person {
		height: 800px;
		left: 20px;
		top: -85px
	}
	.ca06 .catch figure .msg {
		width: calc(562px * 0.9);
		left:-25px;
		top:245px;
	}
	.ca07 .catch figure .msg {
		width: calc(603px * 0.9);
		left:-95px;
		top:250px;
	}
}
@media only screen and (max-width: 1149px){
	.ca01 .catch figure .msg {
		width: calc(549px * 0.8);
		left:0px;
		top:260px;
	}
	.ca02 .catch figure .person {
		left: 44px;
	}
	.ca02 .catch figure .msg {
		width: calc(450px * 0.8);
		top:245px;
	}
	.ca03 .catch figure .msg {
		width: calc(358px * 0.8);
		left:0px;
		top:250px;
	}
	.ca04 .catch figure .person {
		left: 30px;
	}
	.ca04 .catch figure .msg {
		width: calc(574px * 0.8);
		left:-50px;
		top:245px;
	}
	.ca05 .catch figure .msg {
		width: calc(426px * 0.8);
		left:0px;
		top:245px;
	}
	.ca06 .catch figure .person {
		height: 770px;
		left: -46px;
	}
	.ca06 .catch figure .msg {
		width: calc(562px * 0.8);
		left:-30px;
		top:245px;
	}
	.ca07 .catch figure .msg {
		width: calc(603px * 0.8);
		left:0px;
		top:250px;
	}
}
@media only screen and (max-width: 1023px){
	.ca_wrapper {
		display: flex;
		justify-content: center;
	}
	.ca_wrapper.reverse {
		flex-direction: row-reverse;
	}
	.ca01 .catch, .ca03 .catch, .ca05 .catch, .ca07 .catch {
		margin-right: 9px;
	}
	.ca02 .catch, .ca04 .catch, .ca06 .catch {
		margin-left: 9px;
	}

	div#to_section img {
		height:300px;
	}
	div.to_section_top a:nth-child(1) {
		margin-left:0;
	}
	div.to_section_top a:nth-child(2) {
		margin-left:-50px;
	}
	div.to_section_top a:nth-child(3) {
		margin-left:-40px;
	}
	div.to_section_top a:nth-child(4) {
		margin-left:-55px;
	}
	
	.to_section_bottom {
		margin-top:-175px;
	}
	div.to_section_bottom a:nth-child(1) {
		margin-left:12px;
	}
	div.to_section_bottom a:nth-child(2) {
		margin-left:-50px;
	}
	div.to_section_bottom a:nth-child(2) img {
		height:290px !important;	
	}
	div.to_section_bottom a:nth-child(3) {
		margin-left:-10px;
	}
	
	/*　　　　　　　ca_section　　　　　　　*/
	#ca01section, 
	#ca02section, 
	#ca03section, 
	#ca04section, 
	#ca05section, 
	#ca06section, 
	#ca07section, 
	#ca08section, 
	#ca09section {
		padding-top:50px;
	}
	#ca09section {
		padding-bottom:0;
	}
	article#caWrap section {
		padding:20px;
		margin-bottom:0;
	}
	.catch, .status {
		padding:8px;
		border:2px solid #000000;
	}
	
	/*      catch      */
	.catch {
		width:36vw;
		max-width:173px;
		height:340px;
	}
	.catch h2 {
		letter-spacing:0.5px;
	}
	.catch p {
		color:#FFFFFF;
		font-size:11px;
		letter-spacing:0;
		margin-bottom: 4px;
	}
	.catch p span {
		padding:2px 0;
	}
	.catch h3 {
		font-size:15px;
	}
	.catch figure .area {
		width:70px;
		height:auto;
		position:absolute;
		bottom: 5px;
	}
	.catch figure .areaOsakaR {
		left:-5px;
	}
	.catch figure .areaOsakaY {
		left:-5px;
	}
	.catch figure .areaTokyoR {
		left:-15px;
	}
	.catch figure .areaTokyoY {
		left:-5px;
	}
	.catch figure .person {
		position:absolute;
		width:auto;
		height:298px;
		top:64px;
	}
	.catch figure .msg {
		position:absolute;
		height:auto;
	}
/* 個別調整 */
	.ca01 .catch p {
		margin-bottom:15px;
	}
	.ca01 .catch figure .person {
		height:305px;
		top:56px;
		left:-5px;
	}
	.ca01 .catch figure .msg {
		width:151px;
		left:-8px;
		top: 131px;
	}
	.ca02 .catch p {
		margin-bottom:14px;
	}
	.ca02 .catch figure .person {
		height:306px;
		top:75px;
		left:-5px;
	}
	.ca02 .catch figure .msg {
		width:152px;
		left:-7px;
		top:145px;
	}
	.ca03 .catch figure .person {
		top: 56px;
		left:0px;
	}
	.ca03 .catch figure .msg {
		width:147px;
		left:0px;
		top:132px;
	}
	.ca04 .catch figure .person {
		height:320px;
		left:-7px;
		top:30px;
	}
	.ca04 .catch figure .msg {
		width:146px;
		left:-5px;
		top:150px;
	}
	.ca05 .catch figure .person {
		height:335px;
		left:-18px;
		top:38px;
	}
	.ca05 .catch figure .msg {
		width:146px;
		left:-8px;
		top:150px;
	}
	.ca06 .catch figure .person {
		height:300px;
		left:-20px;
		top:50px;
	}
	.ca06 .catch figure .msg {
		width:147px;
		left:-5px;
		top:150px;
	}
	.ca07 .catch figure .person {
		height:350px;
		left:-13px;
		top:13px;
	}
	.ca07 .catch figure .msg {
		width:152px;
		left:-5px;
		top:150px;
	}

	/*      status      */
	.status {
		width:52vw;
		max-width:225px;
		height:340px;
		position: relative;
	}
	.status figure img {
		width:100%;
		max-width: 200px;
		height:auto;
		margin-left: 0px;
	}
	.status figure .profile {
		width: calc(100% - 16px);
		height: 178px;
		margin-top:5px;
		display: flex;
		align-items: center;
		text-align:left;
		border:2px solid #000000;
		position: absolute;
    bottom: 8px;
	}
	.status ul {
		padding:5px 5px 0;
	}
	.status ul li {
		float:left;
		margin-bottom:10px;
	}
	.status ul li:nth-child(2) {
		margin-left:9px;
		margin-right:25px;
	}
	.status h4 {
		font-size:10px;
		font-weight:500;
	}
	.status p {
		font-size:11.5px;
		letter-spacing:0;
	}
}
@media only screen and (max-width: 767px){
	/*　　　　　　　to_section　　　　　　　*/
	div#to_section {
		width:320px;
		left:0px;
	}
	div#to_section img {
		height:215px;
	}
	div.to_section_top a:nth-child(1) {
		margin-left:0;
	}
	div.to_section_top a:nth-child(2) {
		margin-left:-35px;
	}
	div.to_section_top a:nth-child(3) {
		margin-left:-35px;
	}
	div.to_section_top a:nth-child(4) {
		margin-left:-37px;
	}
	
	.to_section_bottom {
		margin-top:-120px;
	}
	div.to_section_bottom a:nth-child(1) {
		margin-left:12px;
	}
	div.to_section_bottom a:nth-child(2) {
		margin-left:-35px;
	}
	div.to_section_bottom a:nth-child(2) img {
		height:210px !important;	
	}
	div.to_section_bottom a:nth-child(3) {
		margin-left:-10px;
	}
}

@media only screen and (max-width: 340px){
	/*      catch      */
	.catch {
		width:125px; /*for iPhone SE*/
	}
	/*      status      */
	.status {
		width:155px; /*for iPhone SE*/
	}
}