@charset "UTF-8";

/* ARTICLES */
#articles {padding: 100px 0;}
#articles * {box-sizing: border-box;}

/* casestudy */
.casestudy .titH2 {margin-bottom: 20px; line-height: 1.4; font-size: 28px;}
.casestudy .titH2::after {display: none;}
.casestudy .sect1{padding: 30px; border: 2px solid #e9eaef; border-radius: 10px;margin-bottom: 60px;}
.casestudy .sect1 .flexBox{align-items: center;}
.casestudy .sect1 .imgBox{width: 25%;}
.casestudy .sect1 .txtBox{width: 70%;}
.casestudy .sect1 .tit {margin-bottom: 10px; line-height: 1.7;display: flex;align-items: center;}
.casestudy .sect1 .tit a{color: #333;text-decoration: none;font-weight: bold;}
.casestudy .sect1 .tit span{font-size: 10px;display: inline-block;padding: 0.25em 3em;text-align: center;border-radius: 1.2em;line-height: 1.2;color: #223062;border: #223062 solid 2px;margin-left: 10px;}
.casestudy .sect1 .titH2 {font-size: 36px;}

.casestudy .sect2{padding: 70px 60px 40px; background-color: #e9eaef;margin-bottom: 60px;border-radius: 20px;}
.casestudy .sect2 .box-tit{position: relative;}
.casestudy .sect2 .box-tit .info{display: flex; align-items: center;padding: 0 70px;position: relative;z-index: 2;flex-wrap: wrap;}
.casestudy .sect2 .box-tit .info >figure{width: 20%;margin-right: 5%;}
.casestudy .sect2 .box-tit .info>ul{width: 75%;}
.casestudy .sect2 .box-tit .info::after{width: 100%; height: 100%; position: absolute; background-color: #fff;left: 0;bottom: 20px;content: '';z-index: -1;border-radius: 10px;}
.casestudy .sect2 .box-tit .info>ul li:not(.assign){font-size: 17px;padding-bottom:8px ; border-bottom: 1px solid #e9eaef; color: #223062;margin-bottom: 8px;font-weight: bold;}
.casestudy .sect2 .box-tit .info>ul li img{margin-right: 12px;}
.casestudy .sect2 .box-tit .tit{position: absolute;left: 50%;z-index: 3;font-size: 24px; font-weight: bold;padding: 12px 64px;background:linear-gradient( to right , #5486b6 , #143066 , #143066);;border-radius: 10px;transform: translateX(-50%);color: #fff;top: -43px;}
.casestudy .sect2 .img-arrow{text-align: center;margin-top: 6px;margin-bottom: 45px;}
.casestudy .sect2 .box-content{padding: 60px 70px;background: linear-gradient( to right , #5486b6 , #143066);border-radius: 15px;text-align: center;position: relative;}
.casestudy .sect2 .box-content .title{font-weight: bold;padding-bottom: 40px;margin-bottom: 40px;border-bottom: 2px solid#fff;line-height: 1.67;}
.casestudy .sect2 .box-content .sub-title{font-weight: bold;}
.casestudy .sect2 .box-content .sub-title a{color:#f6d84c;text-decoration: underline ;}
.casestudy .sect2 .box-content .sub-title a:hover {opacity: 0.6;}
.casestudy .sect2 .box-content img{margin-top: 40px;}
.casestudy .sect2 .box-content .tit{position: absolute;left: 50%;z-index: 3;font-size: 24px; font-weight: bold;padding: 12px 64px;background-color:#f6d84c;border-radius: 10px;transform: translateX(-50%);top: -22px;color: #223062;}

.casestudy .sect2 .box-note1{padding: 20px 25px;background-color: #fff;border: 2px solid #eba03b;border-radius: 20px;}
.casestudy .sect2 .box-note1-1{padding: 20px 25px;background-color: #eba03b;border: 2px solid #eba03b;border-radius: 20px;}
.casestudy .sect2 .box-note2{padding: 20px 0px;background-color: #fff;text-align: center;position: relative;}
.casestudy .sect2 .box-note2-1{padding: 20px 0px;background-color: #eba03b;text-align: center;position: relative;}
.casestudy .sect2 .box-note3{padding: 10px 200px;background-color: #fff;text-align: left;position: relative;}
.casestudy .sect2 .box-note4{padding: 0px 0px;background-color: #fff;text-align: right;position: relative;}
.casestudy .sect2 .box-note4-1{padding: 0px 0px;background-color: #eba03b;text-align: right;position: relative;}
.casestudy .sect2 .box-note5{padding: 0px 200px;background-color: #fff;text-align: left;position: relative;}
.casestudy .sect2 .box-note{padding: 40px 100px;background-color: #fff;border: 2px solid #eba03b;border-radius: 20px;text-align: center;position: relative;}
.casestudy .sect2 .box-note p {font-weight: bold;}
.casestudy .sect2 .box-note .tit{position: absolute;left: 50%;z-index: 3;font-size: 24px; font-weight: bold;padding: 12px 64px;background-color:#f6d84c;border-radius: 10px;transform: translateX(-50%);top: -22px;color: #fff;}
.casestudy .sect2 .flex-container{display: flex;flex-wrap: wrap;}
.casestudy .sect2 .flex-item-passA{padding: 5px 5px; font-size: 20px; line-height: 2.14;background-color: #1b6bb2;text-align: center;align-content: center;border-radius: 10px;width: 49%;margin: 0.5%;position: relative;}
.casestudy .sect2 .flex-item-passB{padding: 5px 5px; font-size: 16px; line-height: 2.14;background-color: #4ea6c6;text-align: center;align-content: center;border-radius: 10px;width: 49%;margin: 0.5%;position: relative;}
.casestudy .sect2 .flex-item-thinA{padding: 5px 5px; font-size: 20px; line-height: 2.14;background-color: #d8d8d8;text-align: center;align-content: center;border-radius: 10px;width: 49%;margin: 0.5%;position: relative;}
.casestudy .sect2 .flex-item-thinB{padding: 5px 5px; font-size: 16px; line-height: 2.14;background-color: #ffffff;text-align: center;align-content: center;border-radius: 10px;width: 49%;margin: 0.5%;position: relative;}
.casestudy .sect2 .flex-text{position: absolute;top: 50%;}

.casestudy .sect3{text-align: center;max-width: 740px;margin: auto;}
.casestudy .sect3 #seminar{margin-top: 100px;}
.casestudy .sect3 #seminar .underBar03{margin-bottom: 40px;}

.assign{line-height: 1.7;color: #223062;padding-bottom: 8px;margin-bottom: 8px;font-size: 17px;}


/* casestudy01 */


/* casestudy02 */
.casestudy02 .sect2 .box-note{padding: 40px 60px;}


/* MEDIA */

@media (max-width:1000px ) and (min-width: 768px){
	.casestudy .sect2 .box-tit .info > ul li {font-size: 1.5vw;}
}
@media screen and ( max-width:767px ) {
	#articles {padding: 60px 0 100px;}
	
	.casestudy .titH2 {font-size: 24px; margin-bottom: 0;}
	.casestudy .sect1 .imgBox {width: 100%;}
	.casestudy .sect1 .txtBox{width: 100%;}
	.casestudy .sect2 .box-tit .tit,.casestudy .sect2 .box-content .tit,.casestudy .sect2 .box-note .tit{font-size: min(24px,4.0vw);padding: 12px 40px;}
	.casestudy .sect2 .box-tit .info > figure{width: 100%;margin-right: unset;margin-bottom: 5%;text-align: center;}
	.casestudy .sect2 .box-tit .info > figure img{width: 35%;}
	.casestudy .sect2 .box-tit .info > ul{width: 100%;}
	.casestudy .sect2 .box-tit .info{padding: 20px; padding-bottom: 40px;}
	.casestudy .sect2,.casestudy .sect2 .box-content,.casestudy .sect2 .box-note{padding: 60px 20px;}
	.casestudy .sect2 .box-note3{padding: 10px 0px;}
	.casestudy .sect2 .box-note5{padding: 0px 0px;}
	.casestudy .sect2 .box-tit .info > ul li p{display: flex;align-items: flex-start;}
	.casestudy .sect2 .box-content .title{padding-bottom: 20px;margin-bottom: 20px;}
	.casestudy .sect3 #seminar{margin-top: 50px;}
	.casestudy .sect1 .imgBox img{width: 50%;}
}

@media screen and ( max-width:480px ) {
	.casestudy .sect2 .box-tit .info > ul li{font-size: 14px;}
	.casestudy .sect2 .box-content .title{font-size: 17px;}
	.casestudy .sect1 .imgBox img{width: unset;}
}

@media screen and ( max-width:767px ){
	.titKiraboshi{margin-bottom: 0;line-height: 1.4;text-align: center;font-size: 20px;font-weight: bold;position: relative;color: #223062;}
} 

@media screen and ( min-width:768px ){
	.titKiraboshi{margin-bottom: 20px;line-height: 1.4;text-align: center;font-size: 32px;font-weight: bold;position: relative;color: #223062;}
	.spOnly {display: none;}
}