@charset "utf-8";
/*=============================================================
 ir/individual
=============================================================*/
.pc{
	display: block;
}
.sp{
	display: none;
}
/* #footer
-------------------------------------------------------------*/
#footer {
 margin-top: 0px;
}
section + section{margin-top: 0;}
/* ttl
-------------------------------------------------------------*/
.ttlPage{
	background: #c9e9f3;
}
.ttlPage .ttlArea{
	position: relative;
	padding: 20px 0 80px;
}
.ttlPage .ttlArea .contentsInner{
	position: relative;
	z-index: 3;
}
.ttlPage .ttlArea h1{
	font-size: 4.8rem;
}
.ttlPage .ttlArea h1 span{
}
.ttlPage .ttlArea p{
	width: 40%;
	padding: 30px 0 20px;
	margin: 0;
}
.ttlPage .ttlArea .box-colorA{
	margin-top: 40px;
	background-color: #fff !important;
}
.ttlPage .ttlArea .mainPhoto{
	width: 1000px;
	height: 100%;
	position: absolute;
	top: 0;
	left: 40%;
	text-align: center;
}

.ttlCat{
	margin: 0;
	padding: 30px 0;
	background: linear-gradient(to right, #0064B6 0%, #0039DC 100%);
}
.ttlCat h2{
	width: 100%;
	font-size: 3.2rem;
	color: #fff;
}
.ttlCat h2 span{
	width: 100%;
	font-size: 2.4rem;
	color: #fff;
}

/* digestArea
-------------------------------------------------------------*/
.digestArea{
	padding: 60px 0 130px;
	background: url("/ir/individual/img_digest/dijest_bg.jpg") no-repeat center bottom;
	background-size: cover;
}
.no-webp .digestArea{
	background: url("/ir/individual/img_digest/dijest_bg.jpg") no-repeat center bottom;
	background-size: cover;
}
.webp .digestArea{
	background: url("/ir/individual/img_digest/dijest_bg.webp") no-repeat center bottom;
	background-size: cover;
}
/* digest01
-------------------------------------------------------------*/
#digest01 .boxWhite{
	width: 100%;
	min-height: 390px;
	display: flex;
	justify-content: space-between;
	background-color: #FFF;
}
#digest01 .boxWhite + .boxWhite{
	margin: 30px 0 0;
}
#digest01 .boxWhite .boxTxt{
	width: 50%;
	padding: 60px;
	box-sizing: border-box;
}
#digest01 .boxWhite .boxTxt h3{
	font-size: 2.4rem;
	padding-bottom: 1.8rem;
}
#digest01 .boxWhite .boxFig{
	width: 50%;
	overflow: hidden;
}
#digest01 .boxWhite .boxFig img{
	display: block;
 height: 100%;
 object-fit: cover;
 width: 100%;
}
#digest01 .boxWhite .order1{
	order: 1;
}

/* digest02
-------------------------------------------------------------*/
#digest02 .boxWhite{
	padding: 60px;
	background-color: #fff;
}
#digest02 h3{
	font-size: 2.4rem;
	position: relative;
}
#digest02 h3:after{
	content: "";
	width: 55px;
	height: 24px;
	position: absolute;
	top: 50%;
	left: -60px;
	transform: translateY(-50%);
}
#digest02 h3.ttl01:after{
	background-color: #F3A696;
}
#digest02 h3.ttl02:after{
	background-color: #AC99CC;
}

#digest02 .boxCol3{
	width: 100%;
	display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 0 30px;
}
#digest02 .boxCol3 .box{
	width: calc((100% - 60px) / 3);
}
#digest02 .boxCol3 .box a{
	width: 100%;
	display: flex;
	flex-direction: column;
	margin: 30px 0 0;
 background: linear-gradient(#0072bf, #0072bf) 0 100%/0 2px no-repeat;
	color: #333;
 transition: background .6s;
}
#digest02 .boxCol3 .box a:hover{
	background-size: 100% 2px;
}
#digest02 .boxCol3 .box a .boxThum{
	overflow: hidden;
	border-radius: 10px
}
#digest02 .boxCol3 .box a .boxThum .thum{
	transition: all .3s ease;
}
#digest02 .boxCol3 .box a:hover .boxThum .thum{
	transform: scale(1.2);
}
#digest02 .boxCol3 .box a .boxTtl{
	display: flex;
	flex: 1;
	align-items: center;
	position: relative;
	min-height: 70px;
	padding: 5px 40px 5px 0;
	box-sizing: border-box;
	font-size: 2.0rem;
	font-weight: 500;
	line-height: 1.4;
}
#digest02 .boxCol3 .box a .boxTtl:after{
	content: '';
	background: url("/shared/img/icon-arw-button.svg") center center no-repeat;
	background-size: 24px 24px;
	width: 24px;
	height: 24px;
	position: absolute;
	top: calc(50% - 12px);
	right: 5px;
	transition: all .1s;
}
#digest02 .boxCol3 .box a:hover .boxTtl:after{
	right: 0px;
}


/* digest03
-------------------------------------------------------------*/
#digest03 ul{
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#digest03 ul li{
	width: calc((100% - 30px) / 2);
	display: flex;
	justify-content: space-between;
	align-items: center;
	background-color: #fff;
	box-sizing: border-box;
	margin: 0 0 30px;
	padding: 30px;
}
#digest03 ul li .boxTxt{
	width: calc(78%);
}
#digest03 ul li.icnWide .boxTxt{
	width: calc(63%);
}
#digest03 ul li .boxTxt p{
	margin: 0;
	padding: 0;
	font-size: 2.4rem;
	line-height: 1.25;
}
#digest03 ul li .boxTxt p + p{
	margin: 0;
	padding: 0;
}
#digest03 ul li .boxTxt p.txtLarge{
	font-size: 4.0rem;
}
#digest03 ul li .boxTxt p.txtLarge strong{
	font-size: 7.0rem;
}
#digest03 ul li .boxTxt p .txtSmall{
	font-size: 1.6rem;
}
#digest03 ul li .boxFig{
	width: calc(20%);
}
#digest03 ul li.icnWide .boxFig{
	width: calc(35%);
}
#digest03 ul li.full{
	width: calc(100%);
}
#digest03 ul li .order1{
	order: 1;
}
#digest03 ul li.full .boxTxt{
	width: calc(52%);
	display: flex;
	flex-wrap: wrap;
}
#digest03 ul li.full .boxTxt div.indent{
	margin: 0 15px 0 0;
}
#digest03 ul li.full .boxFig{
	width: calc(45%);
}

/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 Tablet (portrait)
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media only screen and (min-width:768px) and (max-width:1023px){

}
/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 Smartphones
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media only screen and (max-width:768px){
/* ttl
-------------------------------------------------------------*/
.ttlPage{
	background: #cbe7f5;
}
.ttlPage .ttlArea{
	position: relative;
	padding: 20px 0 20px;
}
.ttlPage .ttlArea .contentsInner{
	position: relative;
	z-index: 3;
}
.ttlPage .ttlArea h1{
	font-size: 3.4rem;
}
.ttlPage .ttlArea h1 span{
	display: block;
}
.ttlPage .ttlArea p{
	width: 100%;
	padding: 20px 0 0;
	margin: 0;
}
.ttlPage .ttlArea .box-colorA{
	margin-top: 40px;
	background-color: #fff !important;
}
.ttlPage .ttlArea .mainPhoto{
	width: 100%;
	height: auto;
	position: static;
}

.ttlCat{
	margin: 0;
	padding: 30px 0;
	background: linear-gradient(to right, #0064B6 0%, #0039DC 100%);
}
.ttlCat h2{
	width: 100%;
	font-size: 2.4rem;
	color: #fff;
}
.ttlCat h2 span{
	width: 100%;
	font-size: 1.8rem;
	color: #fff;
}

/* digestArea
-------------------------------------------------------------*/
.digestArea{
	padding: 40px 0 80px;
}
/* digest01
-------------------------------------------------------------*/
#digest01 .boxWhite{
	min-height: auto;
	display: block;
}
#digest01 .boxWhite + .boxWhite{
	margin: 20px 0 0;
}
#digest01 .boxWhite .boxTxt{
	width: 100%;
	padding: 20px;
}
#digest01 .boxWhite .boxTxt h3{
	font-size: 1.8rem;
	padding-bottom: 1.2rem;
}
#digest01 .boxWhite .boxFig{
	width: 100%;
	overflow: hidden;
}
#digest01 .boxWhite .boxFig img{
	display: block;
 height: auto;
 object-fit: fill;
 width: 100%;
}
/*digest02
-------------------------------------------------------------*/
#digest02 .boxWhite{
	padding: 20px;
}
#digest02 h3{
	font-size: 1.8rem;
}
#digest02 h3:after{
	width: 15px;
	height: 18px;
	left: -20px;
}
#digest02 .boxCol3{
	display: block;
}
#digest02 .boxCol3 .box{
	width: calc(100%);
}
#digest02 .boxCol3 .box + .box{
	margin: 30px 0 0;
}
/* digest03
-------------------------------------------------------------*/
#digest03 ul{
	display: block;
}
#digest03 ul li{
	width: calc(100%);
	margin: 0 0 20px;
	padding: 20px;
}
#digest03 ul li .boxTxt p{
	margin: 0;
	padding: 0;
	font-size: 2.0rem;
	line-height: 1.25;
}
#digest03 ul li .boxTxt p.txtLarge{
	font-size: 2.0rem;
}
#digest03 ul li .boxTxt p.txtLarge strong{
	font-size: 4.6rem;
}
#digest03 ul li .boxTxt p .txtSmall{
	font-size: 1.6rem;
}
#digest03 ul li .boxTxt span{
	display: inline-block;
}
#digest03 ul li .boxTxt{
	width: calc(68%);
}
#digest03 ul li.icnWide .boxTxt{
	width: calc(53%);
}
#digest03 ul li .boxFig{
	width: calc(30%);
}
#digest03 ul li.icnWide .boxFig{
	width: calc(45%);
}
#digest03 ul li.full{
	width: calc(100%);
	display: block;
}
#digest03 ul li .order1{
	order: 1;
}
#digest03 ul li.full .boxTxt{
	width: calc(100%);
	padding: 20px 0 0;
}
#digest03 ul li.full .boxTxt div.indent{
	margin: 0 15px 0 0;
}
#digest03 ul li.full .boxFig{
	width: calc(100%);
}
}