/* 全体定義 */
* {
	margin : 0px;
	padding : 0px;
}

html {
	width : 100%;
	height : 100%;
}

body {
	width : 100%;
	height : 100%;
	margin : 0px;
	background-color : #f9f9f9;
	font-family : 'mplus1p', sans-serif;
	font-size : 14px;
	color : #595959;
	display : flex;
	flex-direction : column;
}

a {
	color : #595959;
	text-decoration : none;
}

a:hover {
	color : #00abf2;
}

img {
	border : 0px;
}

.ui-autocomplete {
	max-height : 200px;
	width : auto;
	overflow-y : scroll;
	overflow-x : hidden;
}

/* ローディング */
@keyframes loadAniIcon {
	0% {
		transform : rotate(0deg);
	}

	100% {
		transform : rotate(360deg);
	}
}

@keyframes loadAniText {
	0% {
		opacity : 1.0;
	}

	50% {
		opacity : 0.3;
	}

	100% {
		opacity : 1.0;
	}
}

/* フォント */
@font-face {
	font-family : 'mplus1p';
	src : url('/pcsite/common/images/mplus1pR.woff') format('woff');
	font-style : normal;
	font-weight : 400;
}

@font-face {
	font-family : 'mplus1p';
	src : url('/pcsite/common/images/mplus1pM.woff') format('woff');
	font-style : normal;
	font-weight : 500;
}

/* ローディング */
#cm_loading {
	position : fixed;
	z-index : 999;
	top : 0px;
	left : 0px;
	right : 0px;
	bottom : 0px;
	background-color : gray;
	opacity : 0.8;
	display : flex;
	justify-content : center;
	align-items : center;
}

#cm_loading > img {
	width : 60px;
	height : 60px;
}

/* 共通 */
.cm_display_none {
	display : none;
}

.cm_display_none_important {
	display : none !important;
}

.cm_visibility_none {
	visibility : hidden;
}

/* ヘッダ */
#cm_header {
	width : 100%;
	min-width : 1024px;
	height : 70px;
	min-height : 70px;
	background : linear-gradient(180deg, #f2f2f2 0%, #ffffff 57%);
	box-shadow : 0px 1px 5px rgba(0,0,0,0.3);
}

#cm_header_area {
	width : 100%;
	height : 100%;
	display : flex;
	flex-direction : column;
}

#cm_header_info_area {
	height : 40px;
	display : flex;
}

#cm_header .cm_ihighway_logo_box {
	width : 280px;
	margin-left : 5px;
	margin-right : 10px;
}

#cm_header .cm_ihighway_logo_box:hover {
	cursor : pointer;
}

#cm_header .cm_ihighway_logo_img1 {
	width : 108px;
	height : 40px;
}

#cm_header .cm_ihighway_logo_img2 {
	width : 172px;
	height : 40px;
}

#cm_header .cm_nexco_logo_box {
	width : 59px;
	margin-right : 10px;
}

#cm_header .cm_nexco_logo_img {
	width : 59px;
	height : 40px;
}

#cm_header_update {
	color : #a6a6a6;
	font-size : 12px;
	display : flex;
	align-items : center;
	margin-right : auto;
}

#cm_header_topic_area {
	width : 100%;
	height : 30px;
	background-color : #1fb8df;
}

#cm_header_topic_line {
	position : relative;
	overflow : hidden;
	box-sizing : border-box;
	width : 100%;
	height : 30px;
	background : linear-gradient(90deg, #1a1a1a 0%, #262626 100%);
	color : #f2d491;
	font-size : 16px;
	line-height : 1em;
	white-space : nowrap;
	user-select : none;
	-webkit-user-select : none;
	-moz-user-select : none;
	padding : 4px;
	border-style : solid;
	border-width : 3px;
	border-color : #1fb8df;
	border-radius : 6px;
}

.marquee {
	width : 100%;
	padding : 0.5em 0;
	overflow : hidden;
	margin-bottom : 10px;
	position : relative;
}

.marquee p:after {
	content : "";
	white-space : nowrap;
	padding-right : 0px;
}

.marquee p {
	margin : 0;
	padding-left : 100%;
	display : inline-block;
	white-space : nowrap;
	animation-name : marquee;
	animation-timing-function : linear;
	animation-duration : 30s;
	animation-iteration-count : infinite;
}

@keyframes marquee {
	from   { transform : translate(0%);}
	99%,to { transform : translate(-100%);}
}

/* 動的エリア */
/* メニュー・コンテンツ */
#cm_dynamic {
	width : 100%;
	flex : 1;
	min-height : 625px;
	display : flex;
}

/* メニュー */
#cm_menu {
	width : 80px;
	min-width : 80px;
	height : 100%;
	background-color : rgba(0,144,204,0.4);
	text-align : center;
}

#cm_menu img {
	margin-top : 8px;
	margin-bottom : 1px;
}

#cm_menu .cm_menu_icon_box {
	cursor : pointer;
	position : relative;
	box-sizing : border-box;
	width : 80px;
	height : 110px;
	background-color : rgba(0,144,204,0.0);
	color : #ffffff;
	font-size : 14px;
	line-height : 1em;
	text-align : center;
	text-shadow : 0px 2px 0px rgba(0,0,0,0.07);
}

#cm_menu .cm_menu_icon_box:hover {
	background-color : rgba(0,144,204,0.8);
}

#cm_menu .cm_menu_icon_img {
	width : 80px;
	height : 60px;
}

#cm_menu .selected {
	position : relative;
	box-sizing : border-box;
	width : 80px;
	height : 110px;
	background-color : rgba(0,144,204,0.4);
	color : #ffffff;
	font-size : 14px;
	line-height : 1em;
	text-align : center;
	text-shadow : 0px 2px 0px rgba(0,0,0,0.07);
}

/* コンテンツ */
#cm_contents {
	flex : 1;
	min-width : 944px;
	height : 100%;
	position : relative;
}

/* フッタ */
#cm_footer {
	width : 100%;
	min-width : 1024px;
	height : 28px;
	min-height : 28px;
	background : linear-gradient(180deg, rgba(204,204,204,1) 0%, rgba(242,242,242,1) 18%, rgba(255,255,255,1) 100%);
}

#cm_footer_area {
	width : 100%;
	height : 100%;
	display : flex;
}

#cm_footer .cm_footer_txt {
	color : #a6a6a6;
	font-size : 11px;
	margin-left : 10px;
	margin-right : auto;
	display : flex;
	align-items : center;
}

#cm_footer_link_area {
	display : flex;
	align-items : center;
}

#cm_footer_link_area div {
	margin-right : 20px;
}

#cm_footer_link_area div:hover {
	color : #00abf2;
	cursor : pointer;
}

/* フッタ表示：共通 */
#cm_footer_doc_base {
	position : absolute;
	top : 0px;
	left : 0px;
	width : 100%;
	height : 100%;
	min-width : 1024px;
	min-height : 726px;
	z-index : 4;
}

#cm_footer_doc {
	width : 100%;
	height : 100%;
	background-color : rgba(0, 0, 0, 0.8);
	display : flex;
	justify-content : center;
	align-items : center;
}

#cm_footer_doc_area {
	width : 640px;
	height : 85%;
	background : white;
	display : flex;
	flex-direction : column;
}

#cm_footer_doc_head {
	position : relative;
}

#cm_footer_doc_title {
	padding: 2px 0;
	color : #ffffff;
	background-color : #1ba4d2;
	font-size : 24px;
	text-align : center;
}

#cm_footer_doc_close {
	position : absolute;
	top : 5px;
	right : 5px;
	width : 30px;
	height : 30px;
	padding : 6px;
	box-sizing : border-box;
	overflow : hidden;
	border-style : solid;
	border-width : 1px;
	border-color : rgba(255, 255, 255, 0);
	border-radius : 15px;
	cursor : pointer;
}

#cm_footer_doc_close:hover {
	border-color : rgba(255, 255, 255, 1);
}

#cm_footer_doc_text {
	flex : 1;
	overflow : auto;
	background-color : #f2f2f2;
}

/* フッタ表示：静的 */
#cm_footer_static_area {
	padding : 20px ;
	text-align : center;
}

#cm_footer_static_area .column {
	position : relative ;
	box-sizing : border-box ;
	width : 100% ;
	color : #444444 ;
	font-size : 14px ;
	line-height : 20px ;
	text-align : left ;
	padding-left : 25px ;
	padding-right : 25px ;
	padding-top : 10px ;
	padding-bottom : 15px ;
}

#cm_footer_static_area .column .uList {
	position : relative ;
	box-sizing : border-box ;
	font-size : 12px ;
	padding-bottom : 5px ;
	margin-left : 25px ;
	margin-right : 25px ;
	margin-top : 10px ;
}

#cm_footer_static_area .column .uList li {
	position : relative ;
	box-sizing : border-box ;
	color : #777777 ;
	font-size : 12px ;
	line-height : 16px ;
	margin-bottom : 5px ;
}

#cm_footer_static_area .column .uList dt {
	position : relative ;
	box-sizing : border-box ;
	font-size : 12px ;
	line-height : 16px ;
	margin-bottom : 5px ;
}

#cm_footer_static_area .column .uList dd {
	position : relative ;
	box-sizing : border-box ;
	font-size : 12px ;
	line-height : 16px ;
	margin-bottom : 5px ;
}

#cm_footer_static_area .column .read {
	position : relative ;
	box-sizing : border-box ;
	color : #777777 ;
	font-size : 12px ;
	line-height : 18px ;
	margin-top : 0px ;
	margin-bottom : 5px ;
}

#cm_footer_static_area .contactBox {
	position : relative ;
	box-sizing : border-box ;
	width : 600px ;
	background-color : rgba(255,255,255,0.4) ;
	border-style : solid ;
	border-width : 1px ;
	border-color : #ffffff ;
	border-radius : 4px ;
	box-shadow : 0px 1px 2px rgba(0,0,0,0.1) ;
	margin-left : auto ;
	margin-right : auto ;
	margin-bottom : 10px ;
}

#cm_footer_static_area .contactBox h3 {
	position : relative ;
	box-sizing : border-box ;
	width : 100% ;
	height : 34px ;
	font-size : 18px ;
	font-weight : normal ;
	line-height : 1em ;
	padding : 8px ;
}

#cm_footer_static_area .contactBox .index {
	position : relative ;
	box-sizing : border-box ;
	float : left ;
	width : 220px ;
	height : 40px ;
	color : #4d4d4d ;
	font-size : 14px ;
	line-height : 16px ;
	text-align : center ;
	padding-top : 5px ;
	margin-left : 44px ;
}

#cm_footer_static_area .contactBox .note {
	font-size : 12px ;
}

#cm_footer_static_area .contactBox .telNum {
	position : relative ;
	box-sizing : border-box ;
	float : left ;
	width : 290px ;
	height : 40px ;
	font-size : 40px ;
	line-height : 40px ;
	text-align : left ;
	margin-right : 44px ;
}

#cm_footer_static_area .contactBox .telNum2 {
	position : relative ;
	box-sizing : border-box ;
	width : 100% ;
	height : 40px ;
	font-size : 40px ;
	line-height : 40px ;
	text-align : center ;
}

#cm_footer_static_area .contactBox .memo {
	position : relative ;
	box-sizing : border-box ;
	clear : both ;
	width : 100% ;
	color : #737373 ;
	font-size : 12px ;
	line-height : 14px ;
	text-align : center ;
	padding : 8px ;
}

/* フッタ表示：リンク集 */
#cm_footer_links_area {
	padding: 10px 0;
}

.cm_footer_link_box {
	width: 480px;
	margin: 10px auto;
	border: 1px solid #2c9fd9;
	background-color : white;
	display : flex;
}

.cm_footer_link_box:hover {
	background-color : #d9f6ff;
	border-color : #66cbff;
	box-shadow : 0px 1px 2px rgba(0, 0, 0, 0.15);
	cursor : pointer;
}

.cm_footer_link_icon {
	width : 32px;
	height : 32px;
	margin : 4px;
	background-color : #2c9fd9;
	border-radius : 16px;
}

.cm_footer_link_icon > img {
	width : 32px;
	height : 32px;
}

.cm_footer_link_info {
	width : 100%;
}

.cm_footer_link_title {
	padding : 5px 0 0 5px;
	color : #2c9fd9;
	font-size : 18px;
}

.cm_footer_link_text {
	padding : 5px;
}

/* お知らせ情報ポップアップ */
#cm_popup_area_base {
	top : 2px;
	left : 2px;
	width : calc(100% - 4px);
	height : calc(100% - 4px);
	min-width : 1020px;
	min-height : 722px;
	position : absolute;
	z-index : -1;
}

#cm_popup_area {
	position : absolute;
	top : 0px;
	width : 500px;
	background-color : steelblue;
	padding-left : 5px;
	padding-right : 5px;
	color : #ffffff;
	border-radius : 8px;
	text-align : center;
	z-index : 2;
}

#cm_popup_title {
	display : block;
	height : 36px;
	text-align : center;
	font-size : 22px;
	line-height : 1.7;
}

#cm_popup_title:hover {
	cursor : pointer;
}

#cm_popup_info {
	width : 500px;
	height : 100px;
	background-color : #ffffff;
	text-align : left;
	color : #000000;
	overflow : hidden;
}

#cm_popup_area > button {
	width : 100px;
	height : 34px;
	background-color : steelblue;
	color : #ffffff;
	border : solid 3px #ffffff;
	border-radius : 15px;
	font-size : 18px;
	font-weight : bold;
	margin-top : 5px;
	margin-bottom : 5px;
	cursor : pointer;
}

#cm_popup_area > button:hover {
	background-color : rgba(255,255,255,0.4) !important;
}

#cm_popup_set_non_display {
	position : absolute;
	line-height : 3.1;
	font-size : 14px;
	left : 15px;
}

#cm_popup_set_non_display_input {
	margin-right : 3px;
}
