/* ============================================================
PC
==============================================================*/

@media (min-width: 762px) {
	
	body{
		min-width:960px;
	}

	.Footer__inner{
		min-width:960px;		
	}

	.flex{
		display:flex;
		justify-content: left;
		flex-wrap: wrap;
	}
	
	.ttl{
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 700;
		font-size: 3.6rem;
		text-align: left;
		margin: 0 0 12px;
		color: #252525;
		line-height: 140%;
	}
	
	.ttl span{
		font-family: 'Roboto', sans-serif;
		font-weight: 456;
		letter-spacing: 0;
		font-size: 1.6rem;
		display:
		block;
		color: #252525;
		margin: 0 0 0 25px;
		position: relative;
	}
	
	.ttl span:before{
		content: "";
		display:block;
		position:absolute;
		top:44%;
		left: -21px;
		width:10px;
		height:10px;
		background: linear-gradient(to right, #00b38b 0%, #00b38b 30%, #1b799c 100%);
		border-radius:10px;
		transform: translate(0%, -50%);
	}
	
	.ttl_center{
		text-align:center;	
	}
	
	/* ============================================================
 	main vi 
	==============================================================*/
       
	#main_wrap{
		width: 100%;
		height: 673px;
		margin: 73px 0 44px;
		position: relative;
		overflow: hidden;
		background:
		url("../img/hero_pc.jpg") no-repeat top center;
	}

	#main_copy_wrap{
		position: absolute;
		top: 50%;
		left: 30%;
		transform:
		translate(-50%, -50%);
		/* width: 374px; */
	}
	
	#main_copy_wrap h1{
		width: 600px;
	}
	#main_copy_wrap h1 span{
		letter-spacing:-16px;
	}
	
	#main_copy_wrap p{
		font-size: 2.2rem;
		line-height: 179%;
		letter-spacing: 0.31em;
		margin: 34px 0 0;
		text-align: left;
		color: #fff;
		position: relative;
		font-family: 'Noto Sans JP', sans-serif;
	}

	#main_copy_wrap p span{
		letter-spacing:-4px;
	}
	
	#main_copy_wrap .copy_body{
		position: relative;
	}
	
	#main_copy_wrap .copy_body:before{
		left: 50%;
	}
	#main_copy_wrap .copy_body:after{
		right: 50%;
	}
	
	#main_copy_wrap .copy_body_act:before{
		width: 20px;
		left: 7%;
		opacity:1;
	}
	#main_copy_wrap .copy_body_act:after{
		width: 20px;
		right:9%;
		opacity:1;
	}

	
    
	/* ============================================================
 	tab_btn_wrap
	==============================================================*/

	#tab_btn_wrap {
		transition: all 0.6s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
		z-index: 900;
		position: relative;
	}	
	
	#tab_btn_wrap .top_tab_wrap{
		width: 100%;
		position:
		relative;
		height: 122px;
	}

	#tab_btn_wrap.fix .top_tab_wrap{
		height: 93px;
		transition: all 0.4s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
	}
	#tab_btn_wrap.fix .top_follow_wrap .row li a{
		padding: 14px 18px 35px;
		font-size: 1.5rem;
		line-height: 153%;
	}
	#tab_btn_wrap.fix .top_follow_wrap .row li:before{
		width: 8px;
		height: 8px;
	}

	#tab_btn_wrap .top_follow_wrap{
		height: 100%;
		width: calc(100% - 76px);
		background: linear-gradient( to right, #67339f 0%, #253e97 51%, #0d086c 100%);
		border-radius: 0 136px 122px 0;
		box-shadow: 25px 25px 20px 0 rgb(8,8,8,0.2);
	}

	#tab_btn_wrap.fix{
		position: sticky;
		top: 95px;
		z-index: 100;
	}

	#tab_btn_wrap .top_follow_wrap .row{
		width: calc(100% - 280px);
		max-width: 735px;
		justify-content: space-between;
		position:
		absolute;
		text-align:
		center;
		top: 0;
		left:50%;
		transform: translate(-50%, 0%);
		/* height: 100%; */
	}

	#tab_btn_wrap .top_follow_wrap .row li{
		position:
		relative;
	}
	
	#tab_btn_wrap .top_follow_wrap .row li:before{
		content: "";
		display: block;
		width: 10px;
		height: 10px;
		border-right:
		solid 1px #fff;
		border-bottom:
		solid 1px #fff;
		position: absolute;
		bottom: 14px;
		left: 50%;
		transform: translate(-50%, -50%) rotate(45deg);
		transition: all 0.2s ease-out 0s;
	}
	
	#tab_btn_wrap .top_follow_wrap .row li:hover:before{
    	bottom: 8px;  
		border-right:solid 1px #d5cbdf;
		border-bottom:solid 1px #d5cbdf;  	
    }
	
	#tab_btn_wrap .top_follow_wrap .row li a{
		font-family: 'Noto Sans JP', sans-serif;
		display:block;
		font-weight: 300;
		font-size: 1.6rem;
		line-height: 159%;
		color: #fff;
		letter-spacing: 0.14em;
		text-align:	center;
		padding: 31px 18px 40px;
	}
	
	#tab_btn_wrap .top_follow_wrap .row li a:hover{
		color:#d5cbdf;
	}

	#tab_btn_wrap .top_follow_wrap .row li:nth-child(3) a, #tab_btn_wrap .top_follow_wrap .row li:nth-child(4) a{
		line-height: 288%;
	}
	
	
	
	#tab_btn_wrap.DownMove{		
		transform:translate(0,0);
	}

	#tab_btn_wrap.UpMove{
		transform: translate(0,-160px);
	}
	
		
	/* ============================================================
 	section 01
	==============================================================*/
	
	#sec01{
		width: 100%;
		padding: 0px 0 150px;
		margin: 0px 0 0;
		position: relative;
		z-index: 1;
	}
	
	#sec01 .wrapper{
		width: 80%;
		max-width: 1120px;
		min-width: 800px;
	}
	
	#sec01 h3{
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 400;
		letter-spacing: 0.1em;
		font-size: 2.6rem;
		color:#000;
		margin: 5px 0 17px;
	}
	
	#sec01 h4{
		font-family: 'Noto Sans JP', sans-serif;
		text-align:center;
		margin: 17px 0 15px;
		font-size: 2.3rem;
		font-weight:400;
		color:#000;
	}
	
	#sec01 h4 span{
		display:
		block;
		font-size: 1.6rem;
		margin: 0 0 -4px;
	}

	#sec01 ul.btn_list{
		text-align:center;
	}

	#sec01 ul.btn_list a{
		width:100%;
	}

	#sec01 .al_box{
		width:100%;
	}

	#sec01 .l_box{
		margin: 0 3% 0 0;
		width: 30%;
		min-width: 240px;
		max-width: 300px;
		float: left;
	}

	#sec01 .r_box{
		float: right;
		width: 65%;
		max-width: 800px;
	}
	
	#sec01 .img_box_01{
		width: 100%;
	}
	
		
	/* ============================================================
 	section 02
	==============================================================*/
	
	#sec02{
		width: 100%;
		position: relative;
		display: flex;
		z-index: 1;
		padding: 0 0 107px;
	}
	
	#sec02 .wrapper{
		width: 1000px;
		height: auto;
		text-align: center;
	}

	#sec02 .flex_l{
		padding: 40px 78px;
		background:linear-gradient( to right,  #00b38b 0%,  #119696 28%, #1b7b9c 71%, #245ba1 100%);
		border-radius: 15px;
		box-sizing: border-box;
		display: flex;
		justify-content: space-between;
	}

	#sec02 h2 {
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: 400;
        font-size: 3.2rem;
        letter-spacing: 0.2rem;
        text-align: left;
        color: #ffffff;
        filter: drop-shadow(20px 20px 10px #00000022);
    }

	#sec02 h2 span{
		font-size:2.8rem;
	}

	#sec02 p{
        color: #ffffff;
        font-family: 'Noto Sans JP', sans-serif;
		font-size:1.5rem;
		
	}

	#sec02 .btn_list {
	}

	#sec02 .btn_list a{
		width: 243px;
		background: #fff;
		color: #02af8c;
		font-weight: 500;
		margin: 14px 42px 0 0;
	}

	

	#sec02 .btn_list a:hover{
		color:#fff;
		box-shadow: 0;
    	transform: translate(0px,0px);
		background:linear-gradient( to right,  #00b38b 0%,  #119696 28%, #1b7b9c 71%, #245ba1 100%);
		
	}

	#sec02 ul.btn_list a:before{
		border-right: solid 1px #02af8c;
		border-bottom: solid 1px #02af8c;
	}
		
	/* ============================================================
 	sec_strategy
	==============================================================*/
	
	#sec_strategy{
		background:#0e7f80;
		padding: 106px 0 100px;
		background: #0e7f80 url(../img/bg_tech.png) no-repeat top left;
	}

	#sec_strategy .wrapper{
		display:flex;
		justify-content: space-between;
	}

	#sec_strategy .f_box{
		width: 350px;
	}

	#sec_strategy .ttl{
		color:#fff;
	}

	#sec_strategy .ttl span{
		color:#fff;
	}

	#sec_strategy .ttl span:before{
		background:#fff;
	}

	#sec_strategy p{
		color:#fff;
	}

	#sec_strategy .img_box{
		width:614px;
		/* margin: 0 -80px 0 30px; */
		position: relative;
	}

	#sec_strategy .dx_bottun{
		position:absolute;
		top: 38%;
		left: 141px;
		background: linear-gradient(to right, #1ede74 0%, #29c6a3 100%);
		width:100px;
		height:100px;
		border-radius:100px;
		transition: all 0.4s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
	}

	#sec_strategy .dx_bottun2{
		position:absolute;
		top: 38%;
		left: 362px;
		background: linear-gradient(to right, #32c0ed 0%, #1f86ef 100%);
		width:100px;
		height:100px;
		border-radius:100px;
		transition: all 0.4s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
	}

	#sec_strategy .dx_bottun:hover{
		transform:scale(2.2,2.2)!important;
		animation:none;
	}

	#sec_strategy .dx_bottun {
	  animation: anime1 0.8s ease 0s infinite alternate;
	  transform-origin:center;
	}

	#sec_strategy .dx_bottun a{
		display:block;
	}

	#sec_strategy .dx_bottun h3{
        font-family: 'Noto Sans JP', sans-serif;
        font-size: 1.8rem;
        color:#fff;
        text-align:center;
        margin: 26px 0 3px;
 }

	#sec_strategy .dx_bottun:hover h3{
        margin: 14px 0 3px;
        font-size: 1.0rem;
	}

	#sec_strategy .dx_bottun h3:before{
		content: "";
		display: block;
		width: 8px;
		height: 8px;
		border-right:
		solid 1px #fff;
		border-bottom:
		solid 1px #fff;
		position: absolute;
		top: 69%;
		right: 50%;
		transform: translate(0, -50%) rotate(-45deg);
		transition: all 0.3s cubic-bezier(0.13, 0.36, 0.22, 0.96) 0s;
	}

	#sec_strategy .dx_bottun:hover h3:before{
        display:none;
	}

	#sec_strategy .dx_bottun .hide_p{
        font-family: 'Noto Sans JP', sans-serif;
		display:none;
		font-size:0.6rem;
		line-height:130%;
		width: 72%;
		margin: 0 0 0 14px;
		text-align: left;
		transition: all 0.4s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
	}

	#sec_strategy .dx_bottun:hover .hide_p{
		display:block;
	}

	#sec_strategy .dx_bottun h4{
        font-family: 'Noto Sans JP', sans-serif;
        display:none;
        font-size:0.6rem;
        line-height:120%;
        color:#fff;
        background:#000;
        padding:2px 5%;
        border-radius:10px;
        width: 70%;
        margin: 5px 0 0 14px;
        text-align: center;
        transition: all 0.4s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
 }

	#sec_strategy .dx_bottun:hover h4{
		display:block;
	}

	#sec_strategy .f_box img{
		width:166px;
		margin: 30px 0 0;
	}

	/* ============================================================
 	sec_platform
	==============================================================*/
	
	#sec_platform{
		padding: 106px 0 100px;
		background: #007db9 url(../img/bg_tech.png) no-repeat top left;
	}

	#sec_platform .wrapper{
		display:flex;
		justify-content:space-between;
	}

	#sec_platform .left_box{
		position: relative;
	}

	#sec_platform .left_box_wrap{
		position: -webkit-sticky;
		position: sticky;
		top: 100px;
		left: 0;
	}

	#sec_platform .ttl{
		color:#fff;
	}

	#sec_platform .ttl span{
		color:#fff;
	}

	#sec_platform .ttl span:before{
		background:#fff;
	}

	#sec_platform p{
		color:#fff;
		width:400px;
	}

	#sec_platform .flex{
		justify-content:space-between;
	}

	#sec_platform h3{
        font-family: 'Noto Sans JP', sans-serif;
        font-size: 2.2rem;
        color:#007db9;
        background:#fff;
        border-radius:100px;
        text-align:center;
        margin: 0 0 34px;
        font-weight: 600;
 }

	#sec_platform h4{
        font-family: 'Noto Sans JP', sans-serif;
        font-size: 1.7rem;
        color:#fff;
        line-height:120%;
        font-weight: 500;
        text-align: left;
        padding: 12px 0 3px;
 }

	#sec_platform ul.btn_list a{
		padding: 10px 12%;
		font-size: 1.6rem;
		font-weight: 500;
		margin: 14px 0;
		width: 70%;
		border: 1px solid #fff;
	}

	#sec_platform ul.btn_list a:before{
		right: 16px;
	}

	#sec_platform ul.btn_list_plus a:before{
        border-right: solid 1px #fff;
        border-bottom:none;
        transform: translate(0, -50%) rotate(0deg);
        height: 11px;
        top: 52%;
        right: 19px;
 }

	#sec_platform ul.btn_list_plus a:after{
		content: "";
		display: block;
		width: 11px;
		height: 10px;
		border-bottom:solid 1px #fff;
		position: absolute;
		top: 38%;
		right: 14px;
		transform: translate(0, -50%) rotate(0deg);
		transition: all 0.3s cubic-bezier(0.13, 0.36, 0.22, 0.96) 0s;
	}

	#sec_platform .plat_wrap{
		width: 500px;
		margin: 0 0 64px;
	}

	#sec_platform .plat_wrap .flex li{
		width: 48%;
		margin: 0 2px 13px;
	}

	#sec_platform .plat_wrap .btn_list li{
		width: 100%;
	}

	#sec_platform .plat_wrap1 .flex li img{
		width: 100%;
	}

	#sec_platform #plat_wrap_link{
		margin: -140px 0 0;
		padding: 140px 0 0;
	}

	#sec_platform .plat_wrap2{
		margin:0 auto;
		text-align:center;
	}

	#sec_platform .plat_wrap2 .img_box{
		width:400px;
		margin: 28px auto 20px;
	}
	#sec_platform .plat_wrap2 p{
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 1.4rem;
		width: 231px;
		font-weight: 300;
		margin: 10px 0;
	}
	#sec_platform .plat_wrap2 ul.btn_list a{
		width:200px;
	}
	
		
	/* ============================================================
 	sec_case
	==============================================================*/
	
	#sec_case{
		width: 100%;
		padding: 140px 0 100px;
		position: relative;
		z-index: 1;
		filter: drop-shadow(25px 25px 20px #8c899333);
	}

	#sec_case .wrapper{
		width: 80%;
		min-width: 890px;
		max-width: 1000px;
	}
	
	#sec_case .ttl{
		margin: 0 0 33px;
	}
	
	#sec_case .txt{
		font-size: 1.6rem;
		font-weight: 400;
		line-height: 211%;
		margin: 10px 0 51px;
		width: 400px;
	}
	
	#sec_case .flex{
		justify-content:space-between
	}

	#sec_case "fle_li2"{
		width:600px;
	}
	
	#sec_case h4{
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 1.8rem;
		position:relative;
		font-weight: 600;
		text-align:left;
		color: #252525;
		margin: 18px 0 0;
		line-height: 150%;
		padding: 0 0 10px;
		border-bottom: 1px solid #252525;
	}	
	
	#sec_case h4:before{
		content: "";
		display:block;
		position:absolute;
		top: 44%;
		left: -70px;
		width: 50px;
		height: 50px;
		background: url(../img/icon_01.svg) no-repeat top left;
		border-radius:10px;
		transform: translate(0%, -50%);
	}
	
	#sec_case li:nth-child(2) h4:before{
		background: url(../img/icon_02.svg) no-repeat top left;		
	}
	
	#sec_case h5{
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 2.4rem;
		position:relative;
		font-weight: 600;
		text-align:left;
		color: #252525;
		margin: 18px 0 0;
		line-height: 150%;
	}	

	

	#sec_case .row{
		margin: 52px 0 0;
		justify-content: space-between;
	}

	#sec_case h3{
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 1.6rem;
		text-align:center;
		color: #252525;
		margin: 18px 0 0;
	}

    #sec_case .swiper-container_product{
    	margin: 28px 0 0;
    }

	#sec_case .swiper-wrapper{
		justify-content: space-between;
		display: flex;
		flex-wrap: wrap;
	}

	#sec_case .swiper-wrapper:after{
		display:block;
		width:30%;
		content:"";
	}

    #sec_case .swiper-container_product .swiper-slide{
		width: 30%;
		margin: 0 0 76px;
	}

    #sec_case .swiper-container_product a{
    	display:
    	block;
    	transition: all 0.5s cubic-bezier(0, 0, 0.19, 1) 0s;
    }

	
	#sec_case .txt_box{
		border-bottom: 1px solid #252525;
		padding:0 0 13px;
		position: relative;
	}

	#sec_case .txt_box:before{
		content: "";
		display: block;
		width: 8px;
		height: 8px;
		border-right: solid 1px #252525;
		border-bottom: solid 1px #252525;
		position: absolute;
		top: 46%;
		right: 4%;
		transform: translate(0, -50%) rotate(-45deg);
		transition: all 0.3s cubic-bezier(0.13, 0.36, 0.22, 0.96) 0s;
	}

	#sec_case .swiper-slide{
		transition: all 0.3s cubic-bezier(0.13, 0.36, 0.22, 0.96) 0s;
	}

	#sec_case .swiper-slide:hover{
		box-shadow: 25px 25px 20px 0 rgb(40,38,44,0.2);
    	transform: translate(-5px,-5px);		
	}

	#sec_case .swiper-slide:hover .txt_box:before{
		right:18px;
		
	}
	
		
	/* ============================================================
 	sec_news
	==============================================================*/
	
	#sec_news{
		width: 100%;
		padding: 142px 0 0;
		margin: -100px 0 154px;
	}
	
	#sec_news .wrapper{
		width:80%;
		min-width:890px;
		max-width: 1300px;
	}

	#sec_news .btn_list {
		margin: 39px 0 30px;
		position: absolute;
		top: 13px;
		left: 327px;
	}

	#sec_news .btn_list li a{
		width: 239px;
		padding: 18px 30px 18px 33px;
	}
	
	#sec_news .ttl{
		letter-spacing: 0;
		font-size: 4.8rem;
		margin: 0 0 21px;
		line-height: 110%;
	}
	
	
	#sec_news .row{
		width: 100%;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	
	#sec_news .row li{
		width:30%;
		margin: 0 0 45px;
		border-bottom: 1px solid #000;
		transition: all 0.3s cubic-bezier(0.13, 0.36, 0.22, 0.96) 0s;
	}

	#sec_news .row li:hover{
		box-shadow: 25px 25px 20px 0 rgb(40,38,44,0.2);
    	transform: translate(-5px,-5px);
		border-bottom:0px;
	}
	
	#sec_news .row li a{
		display:
		block;
		padding: 26px 11px 29px;
	}
	
	#sec_news .row time{
		font-size: 1.9rem;
		font-weight: 700;
		letter-spacing: 0.1rem;
		margin: 0 22px 0 0;
		font-family: 'Roboto', sans-serif;
	}
	
	#sec_news .row mark{
		padding: 2px 32px 0px;
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 1.4rem;
		font-weight: 400;
		margin: 4px 0 1px;
		letter-spacing: 0.1rem;
		background: linear-gradient( to right, #67339f 0%, #253e97 28%, #0d086c 51%, #e72b8a 100%);
		background-position: 1% 50%;
		background-size: 200% auto;
		color: #fff;
		white-space: nowrap;
	}

	#sec_news .row li .event{
		background: #e6bc00;
	}

	#sec_news .row li .news{
		background: linear-gradient( to right, #1f19ae 0%,  #335ecb 100%);
		padding: 2px 12px 0px;
	}

	#sec_news .row li .other{
		background: #0e7f80;
	}
	
	#sec_news .row li .row{
		justify-content: left;
		flex-wrap: nowrap;
	}
	
	#sec_news .row .txt{
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 1.5rem;
		font-weight: 300;
		line-height: 172%;
		letter-spacing: 0;
		margin: 20px 0 0;
		font-feature-settings: "palt";
	}
	
	#sec_news span.other_icon{
    	display:
    	inline-block;
    	background: url("/company/dx/global/img/gaibu.svg") no-repeat 9px 1px;
    	background-size: 12px auto;
    	padding: 0 0 0 33px;
    	font-size:1.2rem;
    	height: 14px;
    }
	
	#sec_news span.other_pdf{
    	display:
    	inline-block;
    	background: url("/company/dx/global/img/pdf_pc.png") no-repeat 7px 6px;
    	background-size: 14px auto;
    	padding: 0 0 0 33px;
    	font-size:1.2rem;
    	height: 22px;
    }
		
	/* ============================================================
 	sec_recruit
	==============================================================*/
	
	#sec_recruit{
		padding: 130px 0 83px;
		background: url("../img/bg_recruit.jpg") no-repeat top center;
		background-size: cover;
	}

	#sec_recruit .wrapper{
		width: 80%;
		min-width: 820px;
		max-width: 880px;
	}

	#sec_recruit .white_box{
		background:#fff;
		padding: 50px 124px 58px;
		border-radius: 40px;
	}
	
	#sec_recruit .ttl{
		margin: 0 90px 14px 0;
		font-size: 5rem;
		font-size: 3.2rem;
	}
	
	#sec_recruit .ttl span{
		margin: 0 0 -10px 23px;
	}
	
	#sec_recruit .txt{
		margin: 31px 0 0;
		line-height:160%;
		font-weight: 500;
	}

	#sec_recruit .glay li{
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 1.5rem;
		line-height: 245%;
		color: #000;
		font-feature-settings: "palt";
		background: #e5e8eb;
		border-radius: 20px;
		padding: 0 20px;
		margin: 0 11px 19px 0;
	}	
	
	#sec_recruit .txt{
		font-size:1.6rem;
	}
	
	#sec_recruit a{
		transition: all 0.3s cubic-bezier(0.13, 0.36, 0.22, 0.96) 0s;
	}
	
	#sec_recruit a:hover{
		opacity:0.8
	}
	
	
	 
    
    /* ============================================================
 	Modal
	==============================================================*/
	
	#modal_win {
		position: fixed;
		top: 0;
		left: 0;
		background: rgb(0 0 0 / 100%);
		width: 100vw;
		height: 100vh!important;
		z-index: 10000;
		display: none;
		cursor: pointer;
	}

	#modal_win .m_n_wrap {
		position: relative;
		width: 100%;
		height: 100vh!important;
	}

	#modal_win .m_n_box {
		position: absolute;
		top: 50%;
		left: 50%;
		transform:translate(-50%, -20%);
		opacity:0;
		width: 920px;
		box-sizing: border-box;
		background: #fff;
		border-radius: 30px;
		padding: 41px 70px;
		box-shadow: 0 0 30px 6px rgba(0,0,0,0.1);
		transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
	}

	#modal_win .m_n_box .keyword_wrap{
		position:relative;
	}

	#modal_win .m_n_box .row{
		justify-content: space-around;
	}

	#modal_win .m_n_box .row_box{
		text-align:center;
		padding: 0 30px;
	}

	#modal_win .m_n_box .row_box .img_box{
		margin:20px auto 0;
	}

	#modal_win .m_n_box .keyword_wrap h2{
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 500;
		font-size:2.4rem;
		color: #ffffff;
		background: #00b38b;
		font-weight: 600;
		border-radius: 30px;
		text-align: center;
	}

	#modal_win .m_n_box2 .keyword_wrap h2{
		background: #2d4d88;
	}

	#modal_win .m_n_box .keyword_wrap h3{
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 2.0rem;
		color: #000000;
		text-align: center;
		line-height: 147%;
		font-weight: 700;
		margin: 20px 0 17px;
	}
	
	#modal_win .m_n_box .keyword_wrap h4{
		font-family: 'Noto Sans JP', sans-serif;
		color: #000000;
		font-size:1.5rem;
		font-weight: 700;
		letter-spacing: 0.1rem;
		position:relative;
	}
	
	#modal_win .m_n_box .keyword_wrap h4:before{
		content: "";
		display:block;
		position:absolute;
		top: 50%;
		left: -18px;
		width:10px;
		height:10px;
		background: linear-gradient(to right, #00b38b 0%, #00b38b 30%, #1b799c 100%);
		border-radius:10px;
		transform: translate(0%, -50%);
	}

	#modal_win .m_n_box .keyword_wrap .img_box{
		width: 194px;
	}

	#modal_win .m_n_box3 .keyword_wrap h2{
		font-family: 'Noto Sans JP', sans-serif;
		font-size:2.4rem;
		color: #000000;
		line-height: 139%;
		background: none;
		font-weight: 600;
		border-radius: 30px;
		text-align: left;
	}

	#modal_win .m_n_box .keyword_wrap p{
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 400;
		font-size:1.4rem;
		line-height: 170%;
		color: #000000;
		margin: 8px 0 10px;
	}
	
	#modal_win .m_n_box3 .keyword_wrap h3{
		font-family: 'Noto Sans JP', sans-serif;
		color: #000000;
		font-size: 1.7rem;
		font-weight: 700;
		position:relative;
		text-align:left;
		margin: 23px 0 0 20px;
	}
	
	#modal_win .m_n_box3 .keyword_wrap h3:before{
		content: "";
		display:block;
		position:absolute;
		top: 50%;
		left: -18px;
		width:10px;
		height:10px;
		background: linear-gradient(to right, #00b38b 0%, #00b38b 30%, #1b799c 100%);
		border-radius:10px;
		transform: translate(0%, -50%);
	}

	#modal_win .m_n_box3 .keyword_wrap .img_box{
		width: 300px;
	}


	

	#modal_win .m_n_box_act{
		opacity:1;
		transform:
		translate(-50%, -50%);
	}
	
	#modal_win .m_n_box > ul{
		position:relative;
	}
	#modal_win .m_n_box > ul > li{
		background: #000;
		border: 1px solid #000;
		position:
		absolute;
		top: -76px;
		right: -80px;
		border-radius: 100px;
	}
	#modal_win a.xClose{
		display:
		block;
		font-family: 'Roboto', sans-serif;
		font-weight:400;
		font-size: 1.6rem;
		text-align:
		right;
		position: relative;
		background: #00b38b;
		width: 50px;
		border-radius: 100px;
		height: 50px;
		transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
	}
	

	#modal_win a.xClose:before{
		content: "";
		display: block;
		width: 24px;
		height: 2px;
		background: #FFF;
		position: absolute;
		top: 50%;
		left: 50%;
		transform:
		translate(-50%, -50%) rotate(-45deg);
	}
	#modal_win a.xClose:after{
		content: "";
		display: block;
		width: 24px;
		height: 2px;
		background: #FFF;
		position: absolute;
		top: 50%;
		left: 50%;
		transform:
		translate(-50%, -50%) rotate(45deg);
	}

	#modal_win a.xClose:hover{
		color:#fff;
		background:#000;
	}

	#modal_win a.xClose:hover:before,
	#modal_win a.xClose:hover:after{
		background:#fff;
	}



	
	
	
	
	/*CSS*/
	.bg {
		margin: -46px 0 29px;
	}
	.bg .bg-wrap {
	  position: relative;
	  display: inline-block;
	  margin-top: 5px;
	  padding: 0 27px;
	}
	.bg.is-animated .bg-wrap::before {
	  animation: bg 2.6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
	  background: linear-gradient( to left,  #e64dca 0%, #f24b7a 75% );
	  content: "";
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  transform-origin: left center;
	}
	.bg .bg-wrap .inn {
	  color: #fff;
	  display: inline-block;
	  font-family: 'Noto Sans JP', sans-serif;
	  font-size: 2.2rem;
	  font-weight: 400;
	  padding: 5px 15px;
	  position: relative;
	  z-index: 1;
	}
}

	@keyframes bg {
	  0% {
		opacity: 0;
		transform: scaleX(0) translateX(-5%);
	  }
	  30% {
		transform: scaleX(1) translateX(0);
	  }
	  100% {
		transform: scaleX(1) translateX(0);
	  }
	  30%, 100% {
		opacity: 1;
	  }
	}