@charset "UTF-8";
/* ===================================================================
CSS information
 file name  :  common_it01.css
 style info :  IT ベンダー Ver01 ヘッダー・フッター・サブナビ 部分共通 cssの定義
=================================================================== */
body{
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
	font-size: 14px;
	line-height: 1.75;
	color: #333333;
	overflow: hidden;
	line-break: strict;
}
@media only screen and (max-width: 690px) {
	body{
		font-size: 12px;
	}
}
.inner,.inner_1200 {
	width: 92%;
	margin-right: auto;
	margin-left: auto;
	max-width: 1200px;
}
.inner_m,.inner_1120 {
	width: 92%;
	margin-right: auto;
	margin-left: auto;
	max-width: 1120px;
}
.inner_s,.inner_1000 {
	width: 92%;
	margin-right: auto;
	margin-left: auto;
	max-width: 1000px;
}
.inner_ss,.inner_800 {
	width: 92%;
	margin-right: auto;
	margin-left: auto;
	max-width: 800px;
}
@media only screen and (max-width: 690px) {
	.inner,.inner_1200,.inner_m,.inner_1120,
	.inner_s,.inner_1000,.inner_ss,.inner_800,
	#contents {
		width: 88%;
	}
}
/*#container.sub{
	margin-top: 177px;
}*/

.txt_color_key,.txt_color_key a{
	color: #CA062B;
}

.inner_1200 .inner_800{
	padding-right: 0;
	padding-left: 0;
}
/*@media only screen and (max-width: 690px) {
	.inner,.inner_1200,.inner_m,.inner_1120,
	.inner_s,.inner_1000,.inner_ss,.inner_800 {
		padding-right: 5%;
		padding-left: 5%;
	}
}*/


br.sp,br.tablet{display: none;}
@media only screen and (max-width: 979px) {
	br.pc{display: none;}
	br.tablet{display: block;}
	.txt_c.tablet{text-align: center;}
}
@media only screen and (max-width: 690px) {
	br.tablet{display: none;}
	br.sp{display: block;}
	.txt_c.sp_l{text-align: left;}
}

/*-------------------------------------------------------------------

テキストリンク

---------------------------------------------------------------------*/
/* 矢印左 -----*/
.txt_link a{
	color: #CA062B;
	display: inline-block;
	position: relative;
	text-decoration: none;
}
.txt_link_nonkey a{
	display: inline-block;
	position: relative;
	text-decoration: none;
}
.txt_link_arrl{
	position: relative;
	padding-left: 15px;
}
.txt_link_arrl.txt_r{
	padding-right: 15px;
	padding-left: 0;
}
.txt_link_arrl::before{
	content: "";
	width: 6px;
	height: 6px;
	border-top: 2px solid #CA062B;
	border-right: 2px solid #CA062B;
	transform: rotate(45deg);
	position: absolute;
	top: calc(50% - 3px);
	left: 0;
}
.txt_link_arrl.txt_r::before{
	left: auto;
	right: 0;
}
.txt_link_arrl a{
	color: #CA062B;
	text-decoration: none;
	display: inline-block;
	position: relative;
}
/* 矢印右 -----*/
.txt_link_arrr{
	position: relative;
	padding-left: 15px;
	display: inline-block;
}
.txt_link_arrr:before{
	content: "";
	width: 6px;
	height: 6px;
	border-top: 2px solid #7F7F7F;
	border-right: 2px solid #7F7F7F;
	transform: rotate(45deg);
	position: absolute;
	top: calc(50% - 3px);
	left: 0;
}
_:-ms-input-placeholder, :root .txt_link_arrr:before {
	top: calc(50% - 5px);
}

.txt_link_arrr a{
	color: #7F7F7F;
	text-decoration: none;
	position: relative;
	display: inline-block;
}

/* 共通 -----*/
.txt_link_arrl a::after,
.txt_link a::after,
.txt_link_arrr a::after,
.txt_link_nonkey a::after{
	content: "";
	width: 0;
	height: 1px;
	left: 0;
	bottom: 0;
	position: absolute;
	background-color: #CA062B;
	display: block;
	transition: all .2s ease 0s;
}
.txt_link_arrr a::after{
	background-color: #999999;
}
/*.txt_link_arrl.txt_r a::after{
	left: auto;
	right: 0;
}*/
.txt_link_arrl a:hover::after,
.txt_link a:hover::after,
.txt_link_arrr a:hover::after,
.txt_link_nonkey a:hover::after{
	width: 100%;
}
.txt_link_nonkey a:hover{
	color: #CA062B;
}

.ie{display: none;}
@media all and (-ms-high-contrast: none){
	.ie{display: block;}
}

/*-------------------------------------------------------------------

共通ボタン

---------------------------------------------------------------------*/
.template_it01_btn{
	margin-right: auto;
	margin-left: auto;
	max-width: 400px;
	width: 80%;
}
.template_it01_btn.btn_left{
	margin-left: 0;
}
.template_it01_btn.btn_right{
	margin-right: 0;
}
.template_it01_btn a{
	display: block;
	text-align: center;
	color: #CA062B;
	border: 1px solid #CA062B;
	position: relative;
	border-radius: 60px;
	padding: 15px 50px 15px 40px;
	background-color: #ffffff;
	box-shadow: 0 12px 16px rgba(0, 0, 0, 0.05);
	transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
}
.template_it01_btn a::before{
	content: "";
	width: 18px;
	height: 18px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #CA062B;
	position: absolute;
	top: calc(50% - 9px);
	right: 20px;
}
.template_it01_btn a::after{
	content: "";
	width: 4px;
	height: 4px;
	border-top: 2px solid #ffffff;
	border-right: 2px solid #ffffff;
	transform: rotate(45deg);
	position: absolute;
	top: calc(50% - 3px);
	right: 27px;
}
.template_it01_btn a:hover{
	color: #ffffff;
	border-color: #96855a;
	background-color: #96855a;
	text-decoration: none;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
	transform: scale(1.05);
}
@media all and (-ms-high-contrast: none){
	.template_it01_btn a:hover{transform: scale(1);}
}
.template_it01_btn a:hover::before{
	background: #ffffff;
}
.template_it01_btn a:hover::after{
	border-top-color: #96855a;
	border-right-color: #96855a;
}
/* bg color --------*/
.template_it01_btn.bg_color a{
	background-color: #CA062B;
	color: #ffffff;
	border: 1px solid #ffffff;
}
.template_it01_btn.bg_color a::before{
	background: #ffffff;
}
.template_it01_btn.bg_color a::after{
	border-top-color: #CA062B;
	border-right-color: #CA062B;
}
.template_it01_btn.bg_color a:hover{
	color: #CA062B;
	border-color: #CA062B;
	background-color: #ffffff;
}
.template_it01_btn.bg_color a:hover::before{
	background: #CA062B;
}
.template_it01_btn.bg_color a:hover::after{
	border-top-color: #ffffff;
	border-right-color: #ffffff;
}
@media only screen and (max-width: 690px) {
	.template_it01_btn.btn_left{
		margin-left: auto;
	}
}
/*-------------------------------------------------------------------

footer フッター上 ロゴ

---------------------------------------------------------------------*/
footer{
	border-top: 1px solid #eeeeee;
	position: relative;
}
.f_title{
	display: flex;
	align-items: center;
	padding-top: 20px;
	padding-bottom: 20px;
}
.f_logo{
	max-width: 180px;
}
.f_lead{
	margin-left: 20px;
	font-size: 12px;
	color: #777777;
}
.f_lead a{
	font-size: 12px;
	color: #777777;
	position: relative;
	text-decoration: none;
	display: inline-block;s
}
.f_lead a::after {
    content: "";
    width: 0;
    height: 1px;
    left: 0;
    bottom: -5px;
    position: absolute;
    background-color: #999999;
    display: block;
    transition: all .2s ease 0s;
}
.f_lead a:hover::after {width: 100%;}

/*-------------------------------------------------------------------

footer フッター

---------------------------------------------------------------------*/
.f_navi{
	background-color: #333333;
	position: relative;
}
.f_navi_first{
	display: flex;
	justify-content: center;
	padding: 60px 5% 30px;
	justify-content: space-between;
}
/*.f_navi_col{
	padding-right: 5%;
}*/
.f_navi_col a{
	color: #ffffff;
	font-size: 14px;
	position: relative;
	text-decoration: none;
	display: inline-block;
}
.f_navi_col a::after{
	content: "";
	width: 0;
	height: 1px;
	left: 0;
	bottom: -5px;
	position: absolute;
	background-color: rgba(255,255,255,.5);
	display: block;
	transition: all .2s ease 0s;
}
.f_navi_col a:hover::after{
	width: 100%;
}
.f_navi_col li{
	margin-bottom: 25px;
}
.f_navi_col li ul{
	margin-top: 10px;
}
.f_navi_col li li{
	margin-left: 15px;
	margin-bottom: 5px;
	position: relative;
}
.f_navi_col li li::before{
	content: "";
	width: 10px;
	height: 1px;
	background-color: #999999;
	position: absolute;
	top: 50%;
	left: -15px;
}
.f_navi_col li li a{
	font-size: 90%;
}
.f_navi_second{
	border-top: 1px solid rgba(255,255,255,.5);
	padding-top: 50px;
	padding-bottom: 20px;
}
.f_navi_link{
	margin-bottom: 40px;
}
.f_navi_link li{
	margin: 0 15px;
}
.f_navi_second ul{
	display: flex;
	justify-content: center;
	align-items: center;
}
.f_navi_second li a{
	color: #ffffff;
	font-size: 13px;
	position: relative;
	text-decoration: none;
	display: inline-block;
}
.f_navi_second li a::after{
	content: "";
	width: 0;
	height: 1px;
	left: 0;
	bottom: -5px;
	position: absolute;
	background-color: rgba(255,255,255,.5);
	display: block;
	transition: all .2s ease 0s;
}
.f_navi_second li a:hover::after{
	width: 100%;
}
.f_navi_second li a[target="_blank"]{
	background: url("../image/template_it01_icon_target.png") no-repeat right center / 12px auto;
	padding-right: 20px;
}
.f_navi_linkp li{
	padding: 0 25px;
	line-height: 1;
}
.f_navi_linkp li + li{
	border-left: 1px solid rgba(255,255,255,.5);
}
small{
	color: rgba(255,255,255,.5);
	font-size: 11px;
	text-align: center;
	letter-spacing: .16px;
	display: block;
	margin-top: 15px;
}
@media only screen and (max-width: 979px) {
	.f_navi_first{
		flex-wrap: wrap;
		padding: 60px 3% 50px;
	}
	.f_navi_second{
		width: calc(100% - 32px);
		padding: 50px 0 15px;
	}
	.f_navi_second ul.f_navi_link{
		flex-wrap: wrap;
	}
	.f_navi_link li{
		margin: 0 25px 10px 0;
	}
}
@media only screen and (max-width: 690px) {
	.f_navi_first{
		padding: 30px 0 20px;
	}
	.f_navi_col{
		padding: 0 10px;
		width: 50%;
	}
	.f_navi_col a,
	.f_navi_second li a{
		font-size: 12px;
	}
	.f_navi_second{
		padding-top: 30px;
		width: 90%;
	}
	.f_navi_col li{
		margin-bottom: 15px;
	}
	.f_navi_col li a{
		display: inline-block;
	}
	.f_navi_col li ul{
		margin-left: 15px;
	}
	.f_navi_col li li a{
		font-size: 12px;
	}
}

/*-------------------------------------------------------------------

locator ぱんくず

---------------------------------------------------------------------*/
#locator{
	margin-bottom: 60px;
	background-color: #2E2E2E;
}
#locator{
	overflow: hidden;
	width: 100%;
}
#locator ol::after{
	content: "";
	display: table;
	clear: both;
}
#locator li{
	float: left;
	margin: 0 8px 0 16px;
	list-style: none;
	font-size: 11px;
	line-height: 32px;
}
#locator a{
	background-color: #e3e3e3;
	padding: 0 5px 0 10px;
	text-decoration: none;
	color: #333333;
	position: relative;
	font-size: 11px;
	float: left;
}
/*#locator a:hover{
	background-color: #7E0019;
}*/
#locator a::before{
	content: "";
	position: absolute;
	top: 50%;
	margin-top: -16px;
	border-width: 16px 0 16px 16px;
	border-style: solid;
	border-color: #e3e3e3 #e3e3e3 #e3e3e3 transparent;
	left: -16px;
}
#locator li:first-child{
	margin-left: 0;
}
#locator li:first-child a{
	padding-left: 20px;
/*	border-radius: 5px 0 0 5px;*/
}
#locator li:first-child a::before{
	display: none;
}
/*#locator a:hover::before{
	border-color: #7E0019 #7E0019 #7E0019 transparent;
}*/
#locator a:hover{
	color: #2f5d50;
}
#locator a::after{
	content: "";
	position: absolute;
	top: 50%;
	margin-top: -16px;
	border-top: 16px solid transparent;
	border-bottom: 16px solid transparent;
	border-left: 16px solid #e3e3e3;
	right: -16px;
}
/*#locator a:hover::after{
	border-left-color: #7E0019;
}*/
#locator li:last-child{
	position: relative;
	background-color: #2f5d50;
	padding: 0 16px;
	color: #ffffff;
}
#locator li:last-child::before{
	content: "";
	position: absolute;
	top: 50%;
	margin-top: -16px;
	border-width: 16px 0 16px 16px;
	border-style: solid;
	border-color: #2f5d50 #2f5d50 #2f5d50 transparent;
	left: -16px;
}
#locator li:last-child::after{
	content: "";
	position: absolute;
	top: 50%;
	margin-top: -16px;
	border-top: 16px solid transparent;
	border-bottom: 16px solid transparent;
	border-left: 16px solid #2f5d50;
	right: -16px;
}
#locator li.nonlast{background-color: transparent;}
#locator li.nonlast::after{border-left-color: #e3e3e3;}
#locator li.nonlast::before{border-color: #e3e3e3 #e3e3e3 #e3e3e3 transparent;}
#locator li.nonlast a::after{background-color: #e3e3e3;}
#locator li.nonlast a::before{background-color: #e3e3e3;}

#locator li:last-child::before

#locator .current,
#locator .current:hover{
	font-weight: bold;
	background: none;
}
#locator .current::after,
#locator .current::before{
	content: normal;
}
.featuremain_block{
	position: relative;
}
.featuremain_block #locator{
	position: absolute;
	top: 15px;
	left: 0;
	background-color: transparent;
}
@media only screen and (max-width: 690px) {
	#locator{
		margin-bottom: 30px;
		padding: 5px 0;
	}
	#locator a{
		background-color: transparent;
		padding: 0;
	}
	#locator a::before,
	#locator a::after,
	/*#locator li:last-child::before,*/
	#locator li:last-child::after{
		display: none;
	}
	#locator li:first-child a{
		padding-left: 0;
	}
	#locator li:last-child{
		color: #CA062B;
		background-color: transparent;
		padding: 0 5px;
	}
	#locator li{
		margin: 0 16px 0 16px;
		position: relative;
		line-height: 20px;
	}
	#locator li + li::before,
	#locator li:last-child::before{
		content: '';
		border-width: 1px 1px 0 0;
		border-style: solid;
		border-color: #000000;
		position: absolute;
		top: calc(50% - 2px);
		left: -16px;
		width: 4px;
		height: 4px;
		margin: auto;
		vertical-align: middle;
		transform: rotate(45deg);
	}
}


/*-------------------------------------------------------------------

下層 ページタイトル　ページ見出し　ページキャッチ　ページリード文

---------------------------------------------------------------------*/
#pagetitle{
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	position: relative;
	min-height: 130px;
}
.pagetitle_block{
	position: relative;
	z-index: 1;
	min-height: 200px;
}
.pagetitle{
	padding: 170px 20px 0px;
	text-align: center;
	color: #ffffff;
	font-size: 32px;
}
.pagetitle_bg{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-color: rgba(0,0,0,.6);
	z-index: 0;
}
.pagemaintxt{
	margin-bottom: 60px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	padding-right: 5%;
	padding-left: 5%;
	max-width: 1200px;
}
.pagecatch{
	font-size: 28px;
	font-weight: 500;
	margin-bottom: 20px;
	font-weight: bold;
}
.pagelead{
	font-size: 16px;
	color: #777777;
	line-height: 2;
}
@media only screen and (max-width: 690px) {
	.pagetitle_block{
		min-height: auto;
	}
	.pagetitle{
		padding: 100px 0 20px;
		font-size: 28px;
		line-height: 1.6;
	}
	.pagemaintxt{
		margin-bottom: 30px;
		padding-right: 0;
		padding-left: 0;
		width: 90%;
		max-width: 640px;
	}
	#contents .pagemaintxt{width: 100%;}
	.pagecatch{
		font-size: 18px;
		margin-bottom: 10px;
	}
	.pagecatch br{
		display: none;
	}
	.pagelead{
		font-size: 14px;
		text-align: left;
	}
	.pagelead br{
		display: none;
	}
}


/*-------------------------------------------------------------------

header ヘッダー

---------------------------------------------------------------------*/
header {
	/*position: fixed;*/
	top: 0;
	left: 0;
	z-index: 20;
	width: 100%;
	padding: 20px 30px 0;
	transition: .3s;
}
/*body.is_fixed header{
	background-color: #ffffff;
}*/
.header{
	width: 100%;
	max-width: 1600px;
	margin: auto;
	display: flex;
	padding: 10px 30px;
	align-items: center;
}
body#top.headerbg .header{
	background-color: #ffffff;
	border-radius: 6px;
	box-shadow: 0 0 20px 0 rgba(0,0,0,.15);
}
body#sub .header{
	/* background-color: #ffffff; */
	border-radius: 6px;
	/* box-shadow: 0 0 20px 0 rgba(0,0,0,.15); */
}
.hlogo{
	max-width: 160px;
}
@media all and (-ms-high-contrast: none){
	.hlogo{
		width: 160px;
	}
}
.hlogo img{
	max-width: 100%;
	width: auto;
	height: auto;
	display: block;
}
/* gnavi グローバルナビ -------------*/
.hgnavi{
	display: flex;
	align-items: center;
	margin-left: 4%;
}
.hnavi{
	display: flex;
	align-items: center;
	margin-left: auto;
	margin-right: 2%;
}
.hgnavi li,.hnavi li{
	list-style: none;
}
.hgnavi li{
	margin-right: 20px;
}
.hgnavi li a{
	position: relative;
	text-decoration: none;
	font-weight: bold;
	color: #555555;
	display: inline-block;
}
.hgnavi li a::after{
	content: "";
	width: 0;
	height: 1px;
	left: 0;
	bottom: -5px;
	position: absolute;
	background-color: #96855a;
	display: block;
	transition: all .2s ease 0s;
}
.hgnavi li a:hover::after,
.hgnavi li.main_current a::after{
	width: 100%;
}
.hgnavi li a:hover,
.hgnavi li.main_current a{
	color: #96855a;
}
.hnavi li {
	margin-right: 10px;
}
.hnavi li a{
	font-size: 14px;
	display: block;
	padding: 7px 25px 7px 51px;
	background-color: rgba(255,255,255,.5);
	border-radius: 60px;
	text-decoration: none;
	font-weight: 600;
}
.hnavi li.nav_dl a{
	background-image: url(../image/template_it01_icon_download.png);
	background-position: 19px center;
	background-repeat: no-repeat;
	background-size: 22px auto;
	box-shadow: 0 12px 16px rgba(0, 0, 0, 0.05);
	transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
}
.hnavi li.nav_account a{
	background-image: url(../image/template_it01_icon_download.png);
	background-position: 19px center;
	background-repeat: no-repeat;
	background-size: 22px auto;
	box-shadow: 0 12px 16px rgba(0, 0, 0, 0.05);
	transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
}
body#sub .hnavi li,
body#top.headerbg .hnavi li a{
	color: #ffffff;
}
body#sub .hnavi li.nav_dl a,
body#top.headerbg li.nav_dl a{
	background-color: #E06D83;
	color: #ffffff;
	background-image: url(../image/template_it01_icon_download_white.png);
	box-shadow: 0 12px 16px rgba(0, 0, 0, 0.05);
	transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
}
body#sub .hnavi li.nav_account a,
body#top.headerbg li.nav_account a{
	background-color: #CA062B;
	color: #ffffff;
	background-image: url(../image/template_it01_icon_download_white.png);
	box-shadow: 0 12px 16px rgba(0, 0, 0, 0.05);
	transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
}
.hnavi li.nav_dl a:hover,
.hnavi li.nav_account a:hover,
body#sub .hnavi li.nav_dl a:hover,
body#top.headerbg li.nav_dl a:hover,
body#sub .hnavi li.nav_account a:hover,
body#top.headerbg li.nav_account a:hover{
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
	transform: scale(1.05);
}
@media all and (-ms-high-contrast: none){
	.hnavi li.nav_dl a:hover,
	.hnavi li.nav_account a:hover,
	body#sub .hnavi li.nav_dl a:hover,
	body#top.headerbg li.nav_dl a:hover,
	body#sub .hnavi li.nav_account a:hover,
	body#top.headerbg li.nav_account a:hover{transform: scale(1);}
}
@media only screen and (max-width: 979px) {
	header {
		padding: 20px 20px 0;
	}
/*	.header{
		padding: 0;
	}*/
}
@media only screen and (max-width: 690px) {
	.hnavi{
		display: none;
	}
	header {
		padding: 10px 10px 0;
	}
	.header{
		padding: 10px 10px;
	}
}
/*-------------------------------------------------------------------

gnavi グローバルナビ ボタン

---------------------------------------------------------------------*/
.navBtn {
	display: flex;
	flex-wrap: wrap;
/*	width: 75px;
	height: 75px;*/
	width: 32px;
	cursor: pointer;
	align-items: center;
	z-index: 10000;
	transition: all 0.6s cubic-bezier(0.200, 1.000, 0.220, 1.000);
}
.navBtn__inner {
	width: 32px;
	height: 32px;
/*	margin: auto;*/
	position: relative;
/*	overflow: hidden;*/
	transition: all 0.15s ease;
}
.navTxt__inner{
	width: 32px;
	font-size: 10px;
	text-align: center;
	color: #ffffff!important;
	line-height: 1;
	margin-top: 5px;
}
.navBtn__bar {
	position: absolute;
	width: 32px;
	height: 2px;
	left: 0;
	background: #ffffff;
	transition: all 0.2s ease;
}
.navBtn__bar--01 {
	top: 4px;
	background: #fff!important;
}
.navBtn__bar--02 {
	top: calc(50% - 1px);
	background: #fff!important;
}
.navBtn__bar--03 {
	bottom: 4px;
	background: #fff!important;
}
.navBtn__bar--01 {
	animation: navBtn_hover 4s ease-in-out 2s infinite;
}
.navBtn__bar--02 {
	animation: navBtn_hover 4s ease-in-out 2.15s infinite;
	transition-delay: 0.1s;
}
.navBtn__bar--03 {
	animation: navBtn_hover 4s ease-in-out 2.3s infinite;
}
.navBtn:hover .navBtn__bar--01 {
	top: 0;
}
.navBtn:hover .navBtn__bar--03 {
	bottom: 0;
}
@keyframes navBtn_hover {
	0% {
		left: -100%;
		opacity: 0
	}
	10%,90% {
		left: 0;
		opacity: 1
	}
	100% {
		left: 100%;
		opacity: 0
	}
}
@media only screen and (max-width: 690px) {
	.navBtn{
		margin-left: auto;
	}
}
/* topスクロール時用 -------------*/
body#top.headerbg .navBtn__bar{
	background: #000000;
}
body#top.headerbg .navTxt__inner{
	color: #000000;
}

/* 中ページ用 SUB -------------*/
body#sub .navBtn__bar{
	background: #000000;
}
body#sub .navTxt__inner{
	color: #000000;
}

/* sitemaps用 → スマホはハンバーガー -------------*/
.sitemaps .navBtn__bar{
	background: #000000;
}
.sitemaps .navTxt__inner{
	color: #000000;
}
.sitemaps .navBtn{
	margin-left: 20px;
}
.sitemaps .navBtn__bar--01 {
	transform: rotate(45deg);
	animation: none;
	top: 16px;
	background: #000!important;
}
.sitemaps .navBtn__bar--02 {
	display: none
}
.sitemaps .navBtn__bar--03 {
	transform: rotate(-45deg);
	animation: none;
	top: 16px;
	background: #000!important;
}
.sitemaps .navBtn:hover .navBtn__bar--01 {
	top: 16px;
}
.sitemaps .navBtn:hover .navBtn__bar--03 {
	top: 16px;
}

@media only screen and (max-width: 1000px) {
	.hgnavi{
		display: none;
	}
}
@media only screen and (max-width: 690px) {
	.sitemaps .navBtn{
		margin-left: auto;
	}
}
/*-------------------------------------------------------------------

header サイトマップ 中身

---------------------------------------------------------------------*/
.sitemaps{
	background-color: #f5f5f5;
	height: 0;
	width: 100%;
	padding: 35px;
	overflow-y: scroll;
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
	opacity: 0;
	transition: all .2s ease;
}
body.sitemapsopen .sitemaps{
	z-index: 100;
	opacity: 1;
	height: 100vh;
}
.sitemaps_in{
	padding: 30px;
	background-color: #ffffff;
	max-width: 1600px;
	margin: auto;
}
.sitemaps_up{
	display: flex;
	align-items: center;
}
.sitemaps_logo{
	max-width: 160px;
}
.sitemaps_cvnav{
	margin-left: auto;
	display: flex;
	align-items: center;
}
.sitemaps_cvnav li{
	list-style: none;
	margin-left: 5px;
}
.sitemaps_cvnav li a{
	display: block;
	padding: 10px 30px 10px 50px;
	border: 1px solid #E06D83;
	background-color: #E06D83;
	color: #ffffff;
	border-radius: 60px;
	font-size: 13px;
	background-position: 20px center;
	background-repeat: no-repeat;
	background-size: 18px auto;
	border: 1px solid rgba(255,255,255,.5);
	box-shadow: 0 12px 16px rgba(0, 0, 0, 0.05);
	transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
	text-decoration: none;
}
.sitemaps_col a{
	position: relative;
	text-decoration: none;
	display: inline-block;
}
.sitemaps_menu li.main_current a,
.sitemaps_title.main_current a{
	color: #CA062B;
}
.sitemaps_col a::after {
	content: "";
	width: 0;
	height: 1px;
	left: 0;
	bottom: -5px;
	position: absolute;
	background-color: rgba(0,0,0,.5);
	display: block;
	transition: all .2s ease 0s;
}
.sitemaps_cvnav li.nav_dl a{
	background-color: #E06D83;
	color: #ffffff;
	background-image: url(../image/template_it01_icon_download_white.png);
}
.sitemaps_cvnav li.nav_account a{
	background-color: #CA062B;
	color: #ffffff;
	background-image: url(../image/template_it01_icon_download_white.png);
}
.sitemaps_cvnav li a:hover{
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
	transform: scale(1.05);
}
@media all and (-ms-high-contrast: none){
	.sitemaps_cvnav li a:hover{transform: scale(1);}
}
.sitemaps_col a:hover::after {width: 100%;}
.sitemaps_menu{
	max-width: 960px;
	margin: 5% auto 0;
	width: 80%;
	display: flex;
	flex-wrap: wrap;
}
.sitemaps_col{
	width: 25%;
	padding-right: 2%;
	margin-bottom: 10%;
}
.sitemaps_title{
	font-weight: bold;
	font-size: 16px;
	margin-bottom: 20px;
	font-size: 18px;
}
.sitemaps_col li{
	list-style: none;
	margin-bottom: 10px;
	padding-left: 17px;
	position: relative;
}
.sitemaps_col li::before{
	content: "";
	width: 10px;
	height: 1px;
	background-color: #2f5d50;
	position: absolute;
	top: 13px;
	left: 0;
}
.sitemaps_footer{
	padding-top: 40px;
	border-top: 1px solid #dddddd;
}
.sitemaps_footerlink,.sitemaps_info{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
}
.sitemaps_footerlink li,.sitemaps_info li{
	list-style: none;
	padding: 0 1em;
	line-height: 1;
	margin-bottom: 20px;
}
.sitemaps_info{
	margin-top: 30px;
}
.sitemaps_info li + li{
	border-left: 1px solid #cccccc;
}
.sitemaps_info a{
	line-height: 1;
	position: relative;
	text-decoration: none;
}
.sitemaps_info a::after{
	content: "";
	width: 0;
	height: 1px;
	left: 0;
	bottom: -5px;
	position: absolute;
	background-color: rgba(0, 0, 0, 0.3);;
	display: block;
	transition: all .2s ease 0s;
}
.sitemaps_info a:hover::after{
	width: 100%;
}
.sitemaps_footerlink a{
	color: #CA062B;
	position: relative;
	text-decoration: none;
	display: inline-block;
}
.sitemaps_footerlink a::after{
	content: "";
	width: 0;
	height: 1px;
	left: 0;
	bottom: -5px;
	position: absolute;
	background-color: #CA062B;
	display: block;
	transition: all .2s ease 0s;
}
.sitemaps_footerlink a:hover::after{
	width: 100%;
}
.sitemaps_footerlink li a[target="_blank"] {
    background: url("../image/template_it01_icon_target_red.png") no-repeat right center / 16px auto;
    padding-right: 25px;
}
.sitemaps_cvnavbm{
	display: none;
}
@media only screen and (max-width: 1299px) {
	.sitemaps_menu{
		width: 100%;
	}
}
@media only screen and (max-width: 800px) {
	.sitemaps_col{
		margin-bottom: 5%;
	}
	.sitemaps_logo{
		max-width: 140px
	}
	.sitemaps_col{
		width: 50%;
		margin-bottom: 20px;
	}
	.sitemaps_menu li a::after,
	.sitemaps_title a::after,
	.sitemaps_footerlink a::after,
	.sitemaps_info a::after {display: none;}
}
@media only screen and (max-width: 690px) {
	.sitemaps{
		padding: 0;
	}
	.sitemaps_in{
		padding: 5% 5% 80px;
	}
	.sitemaps_cvnav{
		display: none;
	}
	.sitemaps_col{
		width: 100%;
		margin-bottom: 0;
		position: relative;
	}
	.sitemaps_logo{
		max-width: 160px;
	}
	.sitemaps_title{
		font-size: 14px;
		border-top: 1px solid #dddddd;
		margin-bottom: 0;
	}
	.sitemaps_col:last-child .sitemaps_title:last-child{
		border-bottom: 1px solid #dddddd;
	}
	.sitemaps_title a{
		display: block;
		padding: 15px 30px 15px 10px;
	}
/*	.sitemaps_menu .sitemaps_col:first-child .sitemaps_title{
		padding-top: 0;
		margin-top: 0;
		border-top: none;
	}
	.sitemaps_menu .sitemaps_col:last-child .sitemaps_title:last-child{
		padding-bottom: 20px;
		margin-bottom: 0;
		border-bottom: 1px solid #dddddd;
	}*/
	.sitemaps_col ul{
		margin-top: 10px;
		margin-bottom: 20px;
		display: none;
	}
	.sitemaps_col li{
		margin-bottom: 15px;
		border-left: 2px solid #2f5d50;
		padding-left: 15px;
		font-size: 12px;
		font-weight: bold;
	}
	.sitemaps_col li:last-child{
		margin-bottom: 0;
	}
	.sitemaps_col li::before{
		display: none;
	}
	.sitemaps_footer{
		display: none;
	}
	.sitemaps_cvnavbm{
		margin: 30px auto 0;
		width: 80%;
		display: block;
	}
	.sitemaps_cvnavbm li{
		list-style: none;
		margin: 10px auto;
	}
	.sitemaps_cvnavbm li a{
		display: block;
		padding: 10px 30px 10px 50px;
		border: 1px solid #E06D83;
		background-color: #E06D83;
		color: #ffffff;
		border-radius: 60px;
		font-size: 13px;
		background-position: 30px center;
		background-repeat: no-repeat;
		background-size: 18px auto;
		border: 1px solid rgba(255,255,255,.5);
		box-shadow: 0 12px 16px rgba(0, 0, 0, 0.05);
		transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
		text-decoration: none;
		text-align: center;
	}
	.sitemaps_cvnavbm li.nav_dl a{
		background-color: #E06D83;
		color: #ffffff;
		background-image: url(../image/template_it01_icon_download_white.png);
	}
	.sitemaps_cvnavbm li.nav_account a{
		background-color: #CA062B;
		color: #ffffff;
		background-image: url(../image/template_it01_icon_download_white.png);
	}
	.sitemaps_cvnavbm li a:hover{
		box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
		transform: scale(1.05);
	}

	/*-アコーディオンボタン--------*/
	.ocbtn{
		position: absolute;
		top: 10px;
		right: 6px;
		width: 36px;
		height: 36px;
	}
	.ocbtn::after{
		content: "";
		width: 6px;
		height: 6px;
		border-top: 2px solid #000000;
		border-right: 2px solid #000000;
		transform: rotate(135deg);
		display: block;
		transition: all .2s ease 0s;
		position: absolute;
		top: calc(50% - 6px);
		left: calc(50% - 6px);
	}
	.sitemaps_menu .sitemaps_col:first-child .ocbtn{
		top: 6px;
	}
	.ocbtn.active::after{
		transform: rotate(-45deg);
	}
}

/*-------------------------------------------------------------------

サイド fixed ボタン

---------------------------------------------------------------------*/
.fixedbtn{
	position: fixed;
	z-index: 3000;
	right: -30px;
	bottom: 40%;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	opacity: 0;
	transition: all .5s ease;
}
body.headerbg .fixedbtn{
	right: 0;
	opacity: 1;
}
.fixedbtn a{
	display: block;
	background: #CA062B url("../image/icon_seminar.png") no-repeat center 30px / 30px auto;
	color: #ffffff;
	padding: 70px 7px 30px;
	border-radius: 6px 0 0 6px;
	text-decoration: none;
	font-size: 20px;
	letter-spacing: .1em;
}
@media only screen and (max-width: 979px) {
	.fixedbtn{
		display: none !important;
	}
}

/*-------------------------------------------------------------------

エラーページ　error

---------------------------------------------------------------------*/
.error_lead{
	padding: 120px 0;
	background-color: #FDF2F2;
}
.smaplist_title{
	font-size: 24px;
	padding-bottom: 10px;
	border-bottom: 1px solid #cccccc;
	margin-bottom: 30px;
}
.smaplist{
	display: flex;
	flex-wrap: wrap;
}
.smaplist ul{
	margin-right: 3%;
	width: 22%;
}
.smaplist li{
	list-style: none;
	margin-bottom: 20px;
	position: relative;
	padding-left: 15px;
}
.smaplist li::before {
	content: "";
	width: 4px;
	height: 4px;
	border-top: 2px solid #CA062B;
	border-right: 2px solid #CA062B;
	transform: rotate(45deg);
	position: absolute;
	top: 10px;
	left: 0;
}
.smaplist ul ul{
	margin-top: 10px;
	width: 100%;
}
.smaplist ul ul li{
	margin-bottom: 5px;
}
.smaplist ul ul li::before{
	display: none;
}
@media only screen and (max-width: 690px) {
	.error_lead{
		padding: 40px 0;
	}
	.smaplist ul{
		margin-right: 0;
		width: 100%;
		margin-bottom: 0;
	}
	.smaplist_title{
		font-size: 22px;
	}
}

/*-------------------------------------------------------------------

CTA

---------------------------------------------------------------------*/
.cta_area{
	background-color: #fff;
	padding: 60px 0;
}
.cta_title{
	text-align: center;
	color: #2f5d50;
	font-size: 28px;
	font-weight: bold;
	margin-bottom: 40px;
	padding: 0 50px;
}
.cta_block {
	justify-content: center;
}
.cta_block .cta_col{
	padding: 0 4%;
}
.cta_icon{
	width: 120px;
	height: 120px;
	position: relative;
	z-index: 0;
	margin: 0 auto 30px;
	display: flex;
	align-items: center;
}
.cta_icon::after{
	content: "";
	width: 120px;
	height: 120px;
	background-color: #2f5d50;
	border-radius: 120px;
	position: absolute;
	top: 0;
	left: calc(50% - 60px);
	z-index: -1;
}
.cta_icon img{
	width: 90px;
	height: auto;
}
@media all and (-ms-high-contrast: none){
	.cta_icon img{
		width: 60px !important;
	}
}
.cta_txt{
	color: #2f5d50;
	text-align: center;
	margin-bottom: 30px;
	font-weight: bold;
}
.cta_col .template_it01_btn{
	width: 100%;
}
.cta_col .template_it01_btn a:hover{
	background-color: #ffffff;
	color: #CA062B;
}
.cta_col .template_it01_btn a:hover::before{
	background: #CA062B;
}
.cta_col .template_it01_btn a:hover::after{
	border-top-color: #ffffff;
	border-right-color: #ffffff;
}

@media only screen and (max-width: 979px) {
	.cta_area{
		padding-bottom: 30px;
	}
	.cta_block .cta_col{
		margin-bottom: 50px;
		padding: 0 5%;
	}
}
@media only screen and (max-width: 690px) {
	.cta_area{
		padding: 40px 0 0px;
	}
	.cta_title{
		font-size: 18px;
		margin-bottom: 30px;
		line-height: 1.6;
		padding-left: 20px;
		padding-right: 20px;
	}
	.cta_icon{
		margin-bottom: 20px;
	}
	.cta_txt{
		margin-bottom: 10px;
	}
	.cta_icon{
		width: 70px;
		height: 70px;
	}
	.cta_icon::after{
		width: 70px;
		height: 70px;
		left: calc(50% - 35px);
		background-color: rgba(255,255,255,.85);
	}
	.cta_icon img{
		width: 30px;
	}
	.cta_col .template_it01_btn{
		width: 80%;
	}
	.cta_block .cta_col{
		margin-bottom: 35px;
	}
}

/*-------------------------------------------------------------------

subnav

---------------------------------------------------------------------*/
#subnav{
	padding: 30px 10px;
	border-top: 1px solid #dddddd;
}
#subnav_list{
	display: flex;
	align-items: center;
	justify-content: center;
}
#subnav_title{
	display: none;
}
#subnav_list li{
	position: relative;
	list-style: none;
	padding: 0 30px;
}
#subnav_list li:not(:first-child)::before{
	content: "";
	width: 2px;
	height: 60%;
	background-color: #cccccc;
	position: absolute;
	left: 0;
	top: 20%;
}
#subnav_list li a{
	text-decoration: none;
	display: block;
	position: relative;
}
#subnav_list li a::before{
	content: "";
	width: 0;
	height: 2px;
	background-color: #CA062B;
	position: absolute;
	top: -32px;
	left: 0;
	transition: all .2s ease 0s;
}
#subnav_list li.current a::before,
#subnav_list li a:hover::before{
	width: 100%;
}
#subnav_list li.current a,
#subnav_list li a:hover{
	color: #CA062B;
}

@media only screen and (max-width: 690px) {
	#subnav{
		padding: 20px 15px;
	}
	#subnav_list{
		flex-wrap: wrap;
	}
	#subnav_list li{
		width: 100%;
		padding: 0;
	}
	#subnav_list li a{
		display: block;
		padding: 5px 10px 5px 15px;
	}
	#subnav_list li a::before{
		top: 20%;
		width: 0;
		height: 60%;
	}
	#subnav_list li.current a::before,
	#subnav_list li a:hover::before{
		width: 2px;
	}
}

/*-----------------------------------------------------------------

 pagetop

-----------------------------------------------------------------*/
#topcontrol {
	z-index: 150;
	margin-bottom: 0;
}
a.pagetop {
	width: 72px;
	height: 72px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 72px 72px;
	display: block;
	z-index: 50;
	background-image: url(../image/common/pagetop.gif);
}
a.pagetop:hover {
	background-image: url(/dcms_media/image/pagetopHv.gif);
}
.hlogo a {
	background: url(/dcms_media/image/logo_img.png);
	text-decoration: none;
	width:215px;
	height:47px;
	display: block;
	cursor:pointer;
	padding: 0;
	text-align:center;
	transition: 0s;
	color:#fff;
}
.hlogo a .siteTtl {
	display: none
}
.headerbg .hlogo a{
	background-position:left bottom;
}
.pagelink li a:hover,
.rss_block .rss_title a:hover,
.supportitem_btn a:hover,
.caselist li a:hover {
	color: #917C50;
}
@media only screen and (max-width: 979px) {
	#topcontrol {display: none;}
	.fpagetop{
		display: block;
		z-index: 2;
	}
	.fpagetop a{
		color: #ffffff;
		background-color: #f3f3f3;
		display: block;
		height: 26px;
		text-align: center;
		position: relative;
	}
	.fpagetop a::before{
		content: "";
		position: absolute;
		top: calc(50% - 2px);
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 0 5px 5px 5px;
		border-color: transparent transparent #CA062B transparent;
	}
}
@media only screen and (max-width:767px) {
	.hlogo a {
		width: 150px;
		height:39px;
		background-size: 150px;
	}
}