
/* ~~ エレメント / タグセレクター ~~ */
ul, ol, dl, dd { /* ブラウザー間の相違により、リストの余白とマージンをゼロにすることをお勧めします。一貫性を保つために、量をここで指定するか、リストに含まれるリスト項目 (LI、DT、DD) で指定できます。*/
	padding: 0;
	margin: 0;
	list-style: none
}
h1, h2, h3, h4, h5, h6 {
	margin: 0;
	padding: 0;
	font-weight: normal;
}
p {
	margin: 0;
	padding: 0;
	/* text-align: justify; */
}
table{
	border-collapse: collapse;
  	border-spacing: 0;
}
img {
	margin: 0;
	padding: 0;
	vertical-align: text-bottom;
	width: 100%;
	height: auto;
}
a img {
	border: none;
}
a:link {
	color: #222222;
	text-decoration: none !important;
}
a:visited {
	color: #222222;
	text-decoration: none;
}
a:hover, a:active, a:focus {
	text-decoration: none;
}
hr {
	clear: both;
	display: none;
}
.cf:before, .cf:after {
	content: " ";
	display: table
}
.cf:after {
	clear: both
}
.cf {
*zoom:1
}

/*HTML 5 サポート - 新しい HTML 5 タグを display:block に設定します。これにより、ブラウザーでタグが適切にレンダリングされます。 */
header, section, footer, aside, article, figure {
	display: block;
}



/*********   layout  ************/

body {
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, Verdana, Meiryo, sans-serif;
	margin: 0;
	padding: 0;
	line-height: 1.8;
	color: #555555;
	overflow-x: hidden;
}





/*========================================================================
//
// 共通（フォントサイズなど）
//
//========================================================================*/

/*********  PC（画面の横幅が762px以上） ************/

@media (min-width: 762px) {
	html, body {
		height: 100%;
		position: relative;
		font-size: 10px;
	}
	
	.wrapper {
		width: 1000px;
		margin: 0 auto;
		position: relative;
	}
	
	.sp_contents {
		display: none;
	}
}

/*========================================================================
//
// スマホ用　電話番号リンク対応 <a href="tel:0000000000">
//
//========================================================================*/

/*********  PC（画面の横幅が762px以上） ************/

@media (min-width: 762px) {
	a[href*="tel:"] {
        pointer-events: none;
        cursor: default;
        text-decoration: none;
    }
}



/*========================================================================
//
// ヘッダー関連
//
//========================================================================*/


/*********  PC（画面の横幅が762px以上） ************/

@media (min-width: 762px) {
	
	#ghead{
		position: fixed;
		left:0;
		top:0;
		width:100%;
		z-index:900;
	}
	
	#ci_wrap{
		width: 1000px;
		margin: 0 auto;
		position:relative;
	}
	
	#ci_wrap{
		width: 100%;
		margin: 0;
	}

	#ci {
		width: 100px;
		margin: 10px 0 14px 0;
	}
	
	.fix #ci{
		width: 180px!important;
		margin: 19px 0 0px 35px!important;
	}
	
	#ci {
		width: 201px;
		margin: 19px 0 0px 35px;
	}

	header{
		box-shadow: 0 0 10px 10px rgb(0,30,50,0.2);
		padding: 0 0 25px;
		background: #fff;	
	}

	header.fix{
		box-shadow: 0 0 10px 10px rgb(0,30,50,0.2);
		padding: 0 0 25px;
	}

	
	/* head_r_navi start　------------------ */

	#head_r_navi{
		position:absolute;
		right:0;
		top: -18px;
	}

	#head_r_navi ul{
		display: flex;
		justify-content:space-between;
	}

	#head_r_navi li:first-child{
		margin:0 2px 0 0;
	}

	#head_r_navi li:first-child a{
		display:block;
		background:#385692;
		color:#fff;
		padding:16px 18px 6px 20px;
		font-size:1.4rem;
		/*letter-spacing:1px;*/
		transition: all 0.4s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
	}

	#head_r_navi li:first-child a:hover{
		transform: translate(0,8px);
		background:#3761b7;
	}

	#head_r_navi li:last-child a{
		display:		block;
		background: linear-gradient( to right,  #00b38b 0%,  #119696 28%, #1b7b9c 71%, #245ba1 100%);
		color: #fff;
		letter-spacing: 0.1rem;
		border-radius: 31px;
		padding: 2px 29px 2px;
		margin: 49px 24px 0 0;
		font-size: 1.8rem;
		transition: all 0.4s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
		font-weight: 500;
		font-family: 'Roboto', sans-serif;
	}

	.fix #head_r_navi li:last-child a{
		margin: 40px 24px 0 0;
		
	}

	#head_r_navi li:last-child a:hover{
		transform: translate(0,4px);
		background: linear-gradient( to right,  #245ba1 0%, #0c2b52 100%);
		color:#fff;
	}


	/* footer_color　------------------ */

	/* head_r_navi end　------------------ */
	
	
	/* head_navi(グローバルナビ) start　------------------ */
	
    /* cace second start */
	#head_navi{
		width: 100%;
		margin: 0;
		border-bottom: 1px solid #dcdcdc;
	}

	
	#head_navi > ul{
		width: 880px;
		margin: 0 auto;
		display: flex;
		justify-content:space-between;
	}
	
	#head_navi > ul > li{
		position: relative;
	}
	
	#head_navi > ul > li > a{
		display: block;
		font-family: 'Roboto', sans-serif;
		font-weight: 400;
		font-size: 1.4rem;
		color: #2f2f2f;
		/*letter-spacing: 2px;*/
		padding:5px 0 10px;
		position:relative;
	}

	#head_navi > ul > li > a:before,
	#head_navi > ul > li > a:after{
		content: "";
		display: block;
		width: 0;
		height: 3px;
		background:#4053a3;
		position: absolute;
		bottom: -2px;
		left: 50%;
		transform:translate(-50%, -50%);
		transition: all 0.4s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
	}

	#head_navi > ul > li.uline > a:hover:before,
	#head_navi > ul > li.uline > a:hover:after{
		width: 100%;
	}
    
	/* activ set */
	
    #hello #head_navi > ul > li:nth-child(1) > a:before,
	#hello #head_navi > ul > li:nth-child(1) > a:after{
		width: 100%;
	}
	
	#kyoiku #head_navi > ul > li:nth-child(2) > a:before,
	#kyoiku #head_navi > ul > li:nth-child(2) > a:after{
		width: 100%;
	}
	
	.con_kensyu #head_navi > ul > li:nth-child(3) > a:before,
	.con_kensyu #head_navi > ul > li:nth-child(3) > a:after{
		width: 100%;
	}
	
	.con_ryugaku #head_navi > ul > li:nth-child(4) > a:before,
	.con_ryugaku #head_navi > ul > li:nth-child(4) > a:after{
		width: 100%;
	}
	
	#shugaku #head_navi > ul > li:nth-child(5) > a:before,
	#shugaku #head_navi > ul > li:nth-child(5) > a:after{
		width: 100%;
	}
	
	.con_company #head_navi > ul > li:nth-child(6) > a:before,
	.con_company #head_navi > ul > li:nth-child(6) > a:after{
		width: 100%;
	}
	
	#recruit #head_navi > ul > li:nth-child(7) > a:before,
	#recruit #head_navi > ul > li:nth-child(7) > a:after{
		width: 100%;
	}

	/* cace second end */
	
	/* cace home start */
	#head_navi{
		width: 10%;
		margin: -46px 0 0 273px;
		border-bottom:
		none;
	}
	
	#head_navi > ul{
		width: 717px;
		margin: 1px auto;
		display: flex;
		justify-content:
		space-between;
		white-space: nowrap;
	}

	.fix #head_navi > ul{
	}
	
	#head_navi > ul > li{
		position: relative;
	}
	
	#head_navi > ul > li > a{
		display: block;
		font-family: 'Roboto', sans-serif;
		font-weight: 500;
		font-size: 1.2rem;
		color: #656565;
		/*letter-spacing: 2px;*/
		padding:5px 0;
		position:
		relative;
	}

	#head_navi > ul > li.uline > a:before,
	#head_navi > ul > li.uline > a:after{
		content: "";
		display: block;
		width: 0;
		height: 2px;
		background:#fff;
		position: absolute;
		bottom: -2px;
		left: 50%;
		transform:translate(-50%, -50%);
		transition: all 0.4s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
	}

	#head_navi > ul > li.uline > a:hover:before,
	#head_navi > ul > li.uline > a:hover:after{
		width: 100%;
	}
	/* cace home end */
	
	/* sec start */
	
	#head_navi .sec_con{
		width: 400px;
		padding: 16px 0 0;
		opacity:0;
		position: absolute;
		top: 10px;
		left: 50%;
		transform: translate(-50%, 0);
	}

	#head_navi > ul > li.sec_li{
		overflow:hidden;
	}
	#head_navi > ul > li.sec_li:hover{
		overflow:visible;
	}
	
	#head_navi > ul > li.sec_li:hover div.sec_con{
		transition: all 0.4s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
		transform: translate(-50%, 10px);
		opacity:1;
	}
	
	#head_navi .sec_con ul{
		background: linear-gradient( to right,  #00b38b 0%,  #119696 28%, #1b7b9c 71%, #245ba1 100%);
		position:
		relative;
		border-radius:6px;
		padding: 10px 24px;
		box-shadow: 0 0 16px 4px rgba(0,0,0,0.2);
	}

	#head_navi .sec_con ul:before{
		content: "";
		display: block;
		width: 10px;
		height:10px;
		background: #178599;
		position: absolute;
		top: -4px;
		left: 50%;
		transform:
		translate(-50%, 0) rotate(-45deg);
	}

	#head_navi .sec_con li{
		margin:10px 0;
		text-align: left;
	}

	#head_navi .sec_con a{
		display: inline-block;
		font-family: 'Roboto', sans-serif;
		font-weight: 400;
		font-size: 1.2rem;
		text-align:
		center;
		color: #ffffff;
		position:
		relative;
	}

	#head_navi .sec_con a:before,
	#head_navi .sec_con a:after{
		content: "";
		display: block;
		width: 0;
		height: 2px;
		background: #ffffff;
		position: absolute;
		bottom: -2px;
		left: 50%;
		transform:
		translate(-50%, -50%);
		transition: all 0.4s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
	}

	#head_navi .sec_con a:hover:before,
	#head_navi .sec_con a:hover:after{
		width: 100%;
	}

	/* head_lang　------------------ */
	#head_lang {
		position: absolute;
		right: 30px;
		top: 31px;
		height: 32px;
		overflow: hidden;
		transition: height .4s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
	}
	#head_lang a {
		display: inline-block;
		font-size: 1.6rem;
		color: #656565;
		opacity: 0;
		transition: opacity .4s ease, background .4s ease;
	}
	#head_lang .is-current {
		opacity: 1;
		pointer-events: none;
		background: url(/company/dx/img/icon_globe_gr.svg) no-repeat 0 center;
		background-size: 24x;
		margin: 0 0 2px;
		padding: 4px 0 0 38px;
		font-weight: 500;
		font-family: 'Roboto', sans-serif;
	}
	#head_lang span {
		display: block;
		padding: 0 0 0 27px;
    	margin-top: -6px;
    	transition: margin-top .3s ease;
	}
	#head_lang span a {
	    background: none;
	    border-radius: 6px;
	    padding: 3px 12px 1px;
	    color: #fff;
	}
	#head_lang:hover {
		height: 74px;
	}
	#head_lang:hover a {
		opacity: 1;
	}
	#head_lang:hover span {
    	margin-top: 0;
	}
	#head_lang:hover span a {
	    background: #245ba1;
	}
	.fix #head_lang {
		top: 23px;
	}
}





/*========================================================================
//
// パンくず
//
//========================================================================*/


/*********  PC（画面の横幅が762px以上） ************/

@media (min-width: 762px) {
	#pankuzu {
		width:1000px;
		margin:0 auto;
		padding:124px 0 0;
	}
	#pankuzu p{
		font-family: 'Roboto', sans-serif;
		font-weight: 300;
		font-size: 1.2rem;
		line-height: 100%;
		/*letter-spacing: 1px;*/
		padding: 8px 0 9px;
	}
	
	#pankuzu p span{
		color: #4053a3;
	}

	#pankuzu a:hover{
		transition: all 0.5s ease 0s;
        opacity: 0.5;
	}
}





/*========================================================================
//
// パンくず
//
//========================================================================*/


/*********  PC（画面の横幅が762px以上） ************/

@media (min-width: 762px) {
	#pankuzu {
		width:1000px;
		margin:0 auto;
		padding:124px 0 0;
	}
	#pankuzu p{
		font-family: 'Roboto', sans-serif;
		font-weight: 300;
		font-size: 1.2rem;
		line-height: 100%;
		/*letter-spacing: 1px;*/
		padding: 8px 0 9px;
	}
	
	#pankuzu p span{
		color: #4053a3;
	}

	#pankuzu a:hover{
		transition: all 0.5s ease 0s;
        opacity: 0.5;
	}
}





/*========================================================================
//
// Page Top 固定ボタン
//
//========================================================================*/


/*********  PC（画面の横幅が762px以上） ************/

@media (min-width: 762px) {
	.pagetop{
		position: fixed;
		right: -80px;
		top: 95%;
		transform: translate(0, -50%);
		z-index:9000;
		transition: all 0.8s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
	}
	
	.pagetop_act{
		right: -18px;
	}

	.pagetop li a{
		display:block;
		background: #bdc2cc url(/global/img/arrow_w2.png) no-repeat 20px center;
		background-size: 16px auto;
		width: 72px;
		height: 50px;
		border-radius:6px;
		transform: translate(0,0);
		transition: all 0.4s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
	}

	.pagetop li a:hover{
		transform: translate(-8px,0);
		background: #798192 url(/global/img/arrow_w2.png) no-repeat 20px center;
		background-size: 16px auto;
	}
}


/*========================================================================
//
// フッター関連
//
//========================================================================*/


/*********  PC（画面の横幅が762px以上） ************/

@media (min-width: 762px) {
	
	footer{
		background:#fff;
	}
	
	/* f_site_map start */
	#f_site_map{
	}
	

    /* f_copyright_wrap start */
    #f_copyright_wrap{
    	background:#313131;
    	padding:30px 0 100px;
    }

    #f_copyright_wrap p{
    	font-family: 'Roboto', sans-serif;
		font-weight:300;
		/*letter-spacing:1px;*/
		font-size:1.3rem;
		color:#fff;
		float:left;
    }

    #f_copyright_wrap ul{
    	float:right;
    	display: flex;
        justify-content:space-between;
    }

    #f_copyright_wrap li{
    	margin:0 0 0 10px;
    }

    #f_copyright_wrap a{
		font-size: 1.2rem;
		color:#ffffff;
		padding:0 10px;
		border-right:1px solid #9e9e9e;
		border-left:1px solid #9e9e9e;
    }

    #f_copyright_wrap a:hover{
    	transition: all 0.5s ease 0s;
        opacity: 0.5;
    }

}



/*========================================================================
//
// GDPR Cookie
//
//========================================================================*/

/*********  PC（画面の横幅が762px以上） ************/

@media (min-width: 762px) {
	.g-gdpr {
        width: 100%;
        padding: 30px 0;
        display: flex;
        justify-content: center;
        align-items: center;
        background: rgba(0,0,0,1);
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 10000;
        backdrop-filter: blur(15px);
        transition: 1s;
        transform: translateY(100%);
        animation: anime-gdpr 1s both 1s;
    }
    
    .is-gdpr_off .g-gdpr {
        animation: anime-gdpr_off 1s both;
    }
    
    .g-gdpr__text {
        color: #cacaca;
        text-shadow: 0 0 3px #000;
        padding: 0 30px 0 0;
        font-size: 1.5rem;
    }

    .g-gdpr__text a {
        color: #85b9d0;
        text-decoration: underline !important;
        padding: 0 .15em;
        display: inline-block;
    }

    .g-gdpr__text a:hover {
        text-decoration: none;
    }

    a.g-gdpr__button {
        color: #fff;
        font-size: 1.6rem;
        font-weight: 700;
        line-height: 1;
        text-align: center;
        white-space: nowrap;
        vertical-align: middle;
        padding: 1em 2em 1em 2em;
        display: block;
        background: #436cbf;
        border: 1px solid #fff;
        transition: .2s;
        cursor: pointer;
    }

    a.g-gdpr__button:hover {
        opacity: .8;
    }
}


@keyframes anime-gdpr {
	0% {
		transform: translateY(100%);
	}
	100% {
		transform: translateY(0);
	}
}

@keyframes anime-gdpr_off {
	0% {
		transform: translateY(0);
	}
	100% {
		transform: translateY(100%);
	}
}

/*========================================================================
//
// フッターリンク一時的に非表示
//
//========================================================================*/

.footer-nav{
	/* display:none; */
}


