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

@media (min-width: 762px) {

	
	.ttl{
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 700;
		letter-spacing: 0.1em;
		font-size: 3.6rem;
		text-align: left;
		background: linear-gradient( to right,  #0d096c 25%, #66339f 75% );
		-webkit-background-clip: text;
		color: transparent;
		filter: drop-shadow(20px 20px 10px #00000022);
	}
	
	.ttl span{
		font-family: 'Roboto', sans-serif;
		font-weight: 300;
		letter-spacing: 0;
		font-size: 2.2rem;
		display:
		block;
		color:#9b9b9b;
		margin: 0 0 0;
	}
	
	.ttl_center{
		text-align:center;	
	}
	
	/* ============================================================
 	main vi 
	==============================================================*/
       
	#main_wrap{
		width: 100%;
		height: 380px;
		position: relative;
		overflow: hidden;
		background: linear-gradient( to right,  #00b38b 0%,  #119696 28%, #1b7b9c 71%, #245ba1 100%);
		margin: 0 0 44px;
	}

	#main_copy_wrap{
		position: relative;
		width: 80%;
		max-width: 1200px;
		min-width: 1000px;
		margin: 0 auto;
	}
	
	#main_copy_wrap h1{
		font-family: 'Noto Sans JP', serif;
		font-weight: 700;
		font-size: 7.4rem;
		color: #fff;
		text-align: left;
		letter-spacing: 2px;
		margin: 170px 6% 0;
		line-height: 141%;
		width: 48%;
	}
	#main_copy_wrap h1 span{
		font-size: 1.8rem;
		padding: 0px 22px 0px;
		color: #0b175f;
		background-color: #fff;
		display: table;
		margin: 0 0 15px;
		line-height: 188%;
		letter-spacing: 0;
	}

	#main_copy_wrap .img_box_01{
		position: absolute;
		right: 0;
		top: 1%;
		max-width: 500px;
		width: 40%;
		min-width: 360px;
	}

	#main_copy_wrap .img_box_01 img{		
		border-radius:10px;
		box-shadow: 25px 25px 20px 0 rgb(8 8 8 / 20%);
	}
	
	#main_copy_wrap p{
		font-size: 2.2rem;
		line-height: 179%;
		letter-spacing: 0.31em;
		margin: 34px 0 0;
		text-align: center;
		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:100vw;
		position:
		relative;
		height: 122px;
	}

	#tab_btn_wrap .top_follow_wrap{
		height: 122px;
		width: calc(100vw - 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(100vw - 280px);
		max-width: 735px;
		justify-content: space-between;
		position:
		absolute;
		text-align:
		center;
		top: 0;
		left:50%;
		transform: translate(-50%, 0%);
	}

	#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 ----------------------------- */
	#sec01 {
		/* background: #fbfbfb; */
		padding: 31px 0 30px;
		text-align: center;
		border-top: 1px solid #ccc;
	}

	
	#sec01 .wrapper{
		width: 100%;
	}
	
	#sec01 .ttl {
		font-family: 'Ubuntu', sans-serif;
		font-weight: 400;
		font-size: 2.4rem;
		letter-spacing: 1px;
		display: inline-block;
		margin: 0 auto 30px;
		padding: 0 0 0 28px;
		color: #369ae6;
		background: url(../img/icon.png) no-repeat left center;
		background-size: 20px auto;
	}

	#sec01 .sortControl {
	}

	#sec01 .cate_wrap {
		padding: 0 0 20px;
	}

	#sec01 .cate_wrap h3{
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 400;
		font-size: 1.6rem;
		letter-spacing: 1px;
		text-align: left;
		color: #5a5a5a;
		margin: 0 0 0 56px;
		width: 105px;
		float:
		left;
	}

	#sec01 .cate_wrap ul{
		width: 1000px;
		display: flex;
		flex-wrap: wrap;
		justify-content: left;
		margin: 0 auto;
	}

	#sec01 .cate_wrap li{
		width: 161px;
		margin: 0 0 3px 0px;
	}

	#sec01 .cate_wrap label {
		display:block;
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 400;
		font-size: 1.4rem;
		letter-spacing: 1px;
		line-height: 100%;
		text-align:
		center;
		padding: 7px 0 9px;
		cursor: pointer;
		transition: all 0.5s ease 0s;
		border-right: 1px solid #ccc;
		position: relative;
		user-select: none;
	}


	#sec01 .cate_wrap .cond2{
		width: calc(100% - 165px);
		margin: 0 0;
	}

	#sec01 .cate_wrap .cond2 label {
		display:block;
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 400;
		font-size: 1.4rem;
		letter-spacing: 1px;
		line-height: 100%;
		text-align:	center;
		color: #707070;
		border-radius: 20px;background:#fff;
		padding: 7px 0 9px;
		border: 1px solid #707070;
		cursor: pointer;
		margin: 0 11px 0 0;
		transition: all 0.5s ease 0s;
	}
	#sec01 .cate_wrap:nth-child(2) {
		padding: 23px 0 20px;
		background-color: #f1f1f1;
		margin: 8px 0 0;
	}
	#sec01 .cate_wrap .w_wrap{
		width: 1000px;
		margin:0 auto;
	}


    #sec01 .cate_wrap input label{	
		transition: all 0.4s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
	}
	
    #sec01 .cate_wrap input[type=checkbox] {
		display: none;
	}
	
	#sec01 .cate_wrap .cond1 input:checked + label {
		color: #6f7ab1;
	}
	
	#sec01 .cate_wrap .cond1 input:checked + label:before{
		content: "";
		position: absolute;
		bottom: -17px;
		left: 50%;
		width: 6px;
		height: 6px;
		background-color: #8790c7;
		border-radius: 10px;
	}
	
	#sec01 .cate_wrap .cond2 input:checked + label {
		color: #fff;
		border: 1px solid #158c98;
		background: linear-gradient( to right,  #00b38b 0%,  #119696 28%, #1b7b9c 71%, #245ba1 100%);
	}
    

		
	/* ============================================================
 	section 02
	==============================================================*/
	
	#sec02{
		width: 100%;
		padding: 70px 0 140px;
	}
	
	#sec02 .wrapper{
		width:80%;
		min-width: 700px;
		max-width: 1100px;
	}

	#sec02 .btn_list {
		margin:10px 0 30px;
		position: absolute;
		top: 13px;
		left: 271px;
	}

	#sec02 .btn_list li a{
		width: 239px;
		padding: 18px 61px 18px 65px;
	}
	
	#sec02 .ttl{
		letter-spacing: 0;
		font-size: 4.8rem;
		margin: 0 0 21px;
	}
	
	
	#sec02  li{
		width: 100%;
		margin: 0 0 0;
	}
	
	#sec02 li a{
		display:block;
		transition: all 0.4s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
		border-bottom: 1px solid #000;
		padding: 42px 3px 23px;
	}
	

	#sec02 li a:hover{
		box-shadow: 25px 25px 20px 0 rgb(40,38,44,0.2);
    	transform: translate(-5px,-5px);
		border-bottom:0px;
	}
	#sec02 time{
		font-size: 1.9rem;
		font-weight: 700;
		letter-spacing: 0.1rem;
		margin: 0 22px 0 0;
		font-family: 'Roboto', sans-serif;
	}
	
	#sec02 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;
	}

	#sec02 li .event{
		background: #e6bc00;
	}

	#sec02 li .news{
		background: #2d4d88;
		padding: 2px 12px 0px;
	}

	#sec02 li .other{
		background: #0e7f80;
	}
	
	#sec02 .txt{
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 1.6rem;
		font-weight: 400;
		line-height: 172%;
		letter-spacing: 0.1rem;
		margin: 17px 0 0;
		font-feature-settings: "palt";
	}
	
	#sec02 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;
    }
	
	#sec02 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;
    }
		

}



