
/* ~~ エレメント / タグセレクター ~~ */
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;
	background:#eff1f3;
	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{
		width:100%;
		background:#164bc3;
	}
	
	#ci_wrap{
		width: 100%;
		box-sizing: border-box;
		padding: 26px 20px;
	}

	#ci_wrap a{
		display: block;
		width: 470px;
	}
    
	
	/* head_navi start　------------------ */

	#head_navi_wrap{
		background:#053075;
	}

	#head_navi_wrap > div{
		display: flex;
		justify-content:space-between;
		padding: 8px 20px 0;
	}
    
    #head_navi_wrap > div.logout_nav{
		justify-content: flex-end;
	}

	#head_navi_wrap ul{
		display: flex;
		justify-content:space-between;
	}

	#head_navi_wrap > div > a{
		display:block;
		font-weight:400;
		font-family: 'Roboto', sans-serif;
		font-size:1.4rem;
		letter-spacing: 0.1rem;
		color:#fff;
		line-height:100%;
		padding: 6px 0 10px;
	}

	#head_navi_wrap li{
		font-weight:400;
		font-family: 'Roboto', sans-serif;
		font-size:1.4rem;
		color:#fff;
		line-height:100%;
		letter-spacing: 0.1rem;
	}

	#head_navi_wrap li:first-child{
		padding:6px 0 0;
	}

	#head_navi_wrap li.mypage a{
		display:block;
		font-family: 'Noto Sans JP', sans-serif;
		font-weight:400;
		font-size:1.3rem;
		color:#fff;
		letter-spacing: 0;
		padding:4px 0 5px 20px;
		margin:0 0 0 18px;
        background: url("/global/img/icon_mypage.svg") no-repeat left center;
        background-size: auto 98%;
	}

	#head_navi_wrap li.logout a{
		display:block;
		font-family: 'Noto Sans JP', sans-serif;
		font-weight:400;
		color:#fff;
		font-size:1.3rem;
		letter-spacing: 0;
		padding:4px 0 5px 20px;
        background: url("/global/img/icon_logout.svg") no-repeat left center;
        background-size: auto 78%;
		margin:0 0 0 16px;
	}

	#head_navi_wrap li.login a{
		display:block;
		font-family: 'Noto Sans JP', sans-serif;
		font-weight:400;
		color:#fff;
		font-size:1.3rem;
		letter-spacing: 0;
		padding:4px 0 5px 20px;
        background: url("/global/img/icon_login.svg") no-repeat left center;
        background-size: auto 78%;
		margin:0 0 12px;
	}

	#head_navi_wrap a{
		transition: all 0.4s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
	}

	#head_navi_wrap a:hover{
		opacity:0.5;
	}
	
	/* head_navi end　------------------ */
    
    #logout #head_navi_wrap .login_nav{
        display:none;
    }
	#login #head_navi_wrap .logout_nav{
        display:none;
    }

}







/*========================================================================
//
// 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 p{
    	font-family: 'Roboto', sans-serif;
    	font-weight:400;
    	letter-spacing:0.1rem;
    	font-size: 1.2rem;
    	text-align: center;
    	padding: 20px;
    	color: #a0a0a0;
    }

}



/*========================================================================
//
// 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%);
	}
}


