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

article.content {
    position: relative;
    z-index: 2;
}

.btn,
a.btn,
button.btn {
  font-size: 18px;
  font-weight: 700;
  position: relative;
  display: inline-block;
  padding: 10px 0;
  line-height: 1rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #122a81;
  border-radius: 0.5rem;
}

a.btn-flat {
  overflow: hidden;
  padding: 1.5rem 1rem;
  color: #fff;
  border-radius: 0;
  background: #122a81;
  box-shadow: 3px 3px 3px 3px #333;
  width: 80%;
  max-width: 400px;
  margin: 0 auto;
}

a.btn-flat p {
  margin: 0;
  padding: 0;
  font-size: 18px;
}

a.btn-flat:before {
  position: absolute;
  top: 0;
  left: 0;
  width: 150%;
  height: 500%;
  content: "";
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  -webkit-transform: translateX(-98%) translateY(-25%) rotate(45deg);
  transform: translateX(-98%) translateY(-25%) rotate(45deg);
  background: #1E88E5;
  color: #000;
}

a.btn-flat:hover {
	box-shadow: 0px 0px 1px 2px #777;
	text-shadow: -1px -1px -1px #999;
	border-radius: 1px;
}

a.btn-flat:hover:before {
  -webkit-transform: translateX(-9%) translateY(-25%) rotate(45deg);
  transform: translateX(-9%) translateY(-25%) rotate(45deg);
}

.flow_btn_inner {
	max-width: 1390px;
	width: 100%;
	margin: auto;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 20px;
}

.flow_btn_area01{
	float: left;
	width: 100%;
	padding: 50px 0 90px;
	display: flex;
}

.bg-default{
	background-image: url("../images/partner/img03.jpg");
	background-position: left;
	background-repeat: no-repeat;
}


.media .copy {
	font-size: 3vw;
}

.media .content_wrap.point.point01 {
	background-image: url("../images/partner/img01.png");
}

.media .content_wrap.point.point03 {
	background-image: url("../images/partner/img02.jpg");
}

.media dl.sub_title dd {
	padding: 20px 20px 20px 10vw;
	font-size: 24px;
}

.media .point .message {
	width: 50%;
	float: right;
}

.media .point.point01 .message {
	color: #FFF;
}

.media .point.point02 {
	padding: 50px 0;
}

.media .point.point02 .message {
	margin: 50px 0;
}

.media .point.point02 dl {
	border: #122a80 10px solid;
	color: #122a80;
	margin: 50px 0;
}

.media .point.point02 dl.sub_title dt {
	color: #122a80;
}

.media .point.point03 {
	color: #FFF;
}



.media .point dl.sub_title dt {
	text-align: justify;
}

.media .content_wrap.point {
	padding: 0;
}

.media .content_wrap.introduction {
	width: 100%;
	margin: 0;
	padding: 0;
	float: left;
}

.media .content_wrap.introduction h2 {
	text-align: right;
	margin: 100px 100px 0 0;
	font-size: 5vw;
}

.media .glidcont {
	width: 75%;
	min-height: 100vh;
	margin: 0;
	padding: 0;
	float: right;
	background-color: #fff;
}

.media .glidcont .imgbox {
	width: 90%;
	margin: 50px 5%;
	padding: 0;
	text-align: center;
}

.media .glidcont .imgbox img {
	margin: 0 auto;
}

.glidphoto {
	width: 25%;
	height: 100vh;
	margin: 0;
	padding: 0;
	float: left;
	background-image: url("../images/partner/img03.jpg");
	background-position: center;
	background-size: cover;
}

.media .content_wrap.introduction .copy {
	text-align: center;
	font-weight: 700;
	width: 100%;
	margin: 150px 0 50px;
	float: left;
	color: #122a81;
	line-height: 1.3em;
}

.media .content_wrap.introduction .box {
	width: 70%;
	margin: 50px 15%;
	padding: 0;
	float: left;
}


.bg-01 {
	background-image: url("../images/partner/img05.png");
	background-position: left;
	background-repeat: no-repeat;
}

.bg-02 {
	background-image: url("../images/partner/img04.png");
	background-position: right;
	background-repeat: no-repeat;
}

.bg-04 {
	background-image: url("../images/partner/img09.jpg");
	background-position: right;
	background-repeat: no-repeat;
}

.media .content_wrap.winwin {
	width: 100%;
	margin: 0;
	padding: 0;
	float: left;
}



.media .content_wrap.winwin .glidphoto {
	width: 25%;
	height: 100vh;
	margin: 0;
	padding: 0;
	float: right;
	background-image: url("../images/media/img04.png");
	background-position: center;
	background-size: cover;
}

.media .content_wrap.winwin .glidcont {
	float: left;
	background-color: #FFF;
}

.media .content_wrap.winwin .box {
	width: 70%;
	margin: 50px 15%;
	padding: 0;
	float: left;
}

.media .content_wrap.clientdx {
	width: 100%;
	margin: 0;
	padding: 0;
	float: left;
}

.media .content_wrap.clientdx .glidcont {
	margin: 0;
	padding: 0;
	float: left;
}

.media .content_wrap.winwin h3 span {
	font-size: 18px;
}

.media .content_wrap.winwin .photo {
	width: 100%;
	margin:0;
	float: left;
	text-align: center;
}

.media .content_wrap.winwin .photo img {
	width: 80%;
	max-width: 700px;
	margin:0 auto;
}

.media .glidcont dl.graph {
	width: 80%;
	margin: 50px 10%;
	padding: 0;
	float: left;
}

.media .glidcont dl.graph dt {
	width: 40%;
	margin: 0;
	padding: 0;
	float: left;
}

.media .glidcont dl.graph dt h3 {
	width: 100%;
	margin: 0 0 50px;
	padding: 0.5em 0;
	float: left;
	color: #FFF;
	background-color: #122a81;
}

.media .glidcont dl.graph dd {
	width: 60%;
	margin: 0;
	padding: 0;
	float: left;
}

.media .media_type {
	width: 100%;
	margin: 0;
	padding: 50px 0;
	float: left;
}

.media .media_type h2 {
	width: 90%;
	margin: 0 5% 50px;
	padding: 0;
	text-align: center;
	font-size: 36px;
}

.media .media_type .m_type {
	width: 31%;
	margin: 0 1% 50px;
	padding: 0;
	float: left;
}

.media .media_type a:hover {
	opacity: 1.0;
}

.media .media_type dl {
	width: 100%;
	padding: 10px 0;
	background-color: #FFF;
	color: #122a81;
	border-radius: 10px;
	box-shadow: 0 0 1px 1px rgba(0,0,0,0.30);
	transition: ease 0.3s all;
}

.media .media_type a:hover dl {
	box-shadow: 0px 0px 3px 3px rgba(0,0,0,0.60);
}

.media .media_type dl h3 {
	font-size: 22px;
	text-align: center;
	margin: 20px 0 10px;
}

.media .media_type dl dt {
	margin: 0 20px;
	text-align: center;
	aspect-ratio: 400 / 257;
}

.media .media_type dl dt img {
	margin: 0 auto;
}

.media .media_type dl dd {
	margin: 0 20px 20px;
	height: 100px;
	font-size: 15px;
	text-align: justify;
	line-height: 21px;
}

.media .media_type .more {
	width: 100%;
	margin: 0;
	text-align: center;
}

.media .media_type .more b {
	text-align: center;
	display: block;
	font-size: 15px;
	line-height: 30px;
	letter-spacing: 0;
	transition: ease 0.3s all;
}

.media .media_type .more b span {
	font-size: 20px;
}

.media .media_type a:hover .more b {
	background-color: #FFF;
}

.sp {
  display: none;
}

@media screen and (max-width:1300px) {


}

@media screen and (max-width:991px) {

.media .content_wrap.introduction h2 {
	text-align: center;
	margin: 50px auto 0;
	font-size: 5vw;
}

.media .media_type h2 {
	font-size: 5vw;
}


.media .content_wrap.introduction .copy {
	margin: 20px 0;
}

.media .content_wrap .copy {
	margin: 50px 0 0;
}

.media .winwin .copy {
	margin: 0;
}

	.media .point .message {
    width: 100%;
    margin: 50px 0;
}
	.media .point.point02 .message {
    margin: 50px 0;
}
	.media .glidcont {
    width: 100%;
	min-height: auto; 
}
 .media .glidcont .imgbox {
    margin: 20px 5% 0;
  }
	.glidphoto {
    display: none!important;
}

.bg-default,
  .bg-01,
  .bg-02,
  .bg-04,
  .content_wrap.introduction.fixed-bg-bg-default {
    background-image: none !important;
    background: none !important;
  }


.media .media_type .m_type {
	width: 48%;
	margin: 0 1% 50px;
}
  .fixed-bg {
    min-height: auto !important;
    background-attachment: initial !important;
  }
  .content_wrap.fix .glidcont {
    min-height: auto ;
    padding: 20px 0; 
	}
	.sp {
    display: inline;
  }
}
@media screen and (max-width:767px) {
	.media .content_wrap.introduction .copy {
    font-size: 30px;
    margin: 0px 0 20px;
}
	.media .content_wrap.introduction .box {
    width: 100%;
    margin: 50px auto;
    padding: 0 5%;
}
	.media .content_wrap.winwin .box {
    width: 100%;
    margin: 0;
    padding: 0 5%;
}
	.media dl.sub_title dd {
    padding: 20px;
    font-size: 20px;
}

.media .glidcont dl.graph dt {
	width: 100%;
	margin: 0 0 50px;
}

.media .glidcont dl.graph dd {
	width: 100%;
}

.huck .glid-60,
.huck .glid-40 {
	width: 100%;
}

}

@media screen and (max-width:580px) {

.media .content_wrap.introduction h2 {
	margin: 50px auto;
	font-size: 8vw;
}

.media .media_type h2 {
	margin: 0 auto 50px;
	font-size: 8vw;
}

.media .content_wrap.introduction .copy {
    font-size: 4.5vw;
    margin: 20px 0;
}

.media .content_wrap .copy,
.media .winwin .copy {
    font-size: 4.5vw;
    margin: 50px 0;
}

.media .media_type .m_type {
	width: 100%;
	margin: 0 0% 30px;
}

.media .media_type dl dd {
	margin: 10px 20px 40px;
	height: auto;
}

.media .content_wrap .copy,
.media .winwin .copy{
	font-size: 20px;
	text-align: justify;
	width: 90%;
	margin: 30px 5%;
}

}

@media screen and (max-width:413px) {
	.media .content_wrap.introduction .copy {
    font-size: 20px;
    margin: 0px 0 30px;
}
}

.note-under {
  display: block;
  max-width: 800px;
  margin: 8px auto 0 auto;
  text-align: right;
}

/* CTAテキストを必ず最前面に */
a.btn-flat {
  position: relative;   /* 念のため再指定 */
  z-index: 0;           /* スタッキングコンテキストを作る */
  overflow: hidden;     /* これも明示 */
}

a.btn-flat::before {
  z-index: 0;           /* ベース面（下） */
}

/* 直下のテキスト要素を常に前面へ */
a.btn-flat > * {
  position: relative;
  z-index: 1;           /* テキストを三角より前に */
}

/* テキストが <p> の場合にも効かせる保険（必要なら） */
a.btn-flat p,
a.btn-flat span,
a.btn-flat strong {
  position: relative;
  z-index: 1;
}