/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap');

/* lang属性によってCSS変更する場合 */
html[lang="en"] {
	/* 日本語 */
}
html[lang="en"] {
	/* 英語 */
}
html[lang="zh-cmn-Hans"] {
	/* 中国語（簡体字） */
}

body {
	font-family: 'Noto Sans JP', sans-serif;
	box-sizing: border-box;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	/* text-rendering: optimizeLegibility; */
	/* font-feature-settings : "palt"; */
}

/*!
 * common
 */

h2 {
	font-size: 140%;
	padding-bottom: 5px;
	margin-bottom: 0px;
	border-bottom: #AAAAAA solid 1px;
}
h3 {
	font-size: 120%;
	padding-bottom: 5px;
}

.hide { display: none; }
.hidden { visibility: hidden; }
.visible { visibility: visible; }
.is_debug { display: none; }

[class*="language-"] {
  visibility: hidden;
}

.nowrap { white-space: nowrap; }

.fw-normal { font-weight: normal !important; }
.fw-bold { font-weight: bold !important; }

.tx-xs { font-size: 70% !important; }
.tx-s { font-size: 80% !important; }
.tx-l { font-size: 120% !important; }

.tx-20 { font-size: 20px !important; }
.tx-30 { font-size: 30px !important; }
.tx-40 { font-size: 40px !important; }
.tx-50 { font-size: 50px !important; }
.tx-60 { font-size: 60px !important; }
.tx-70 { font-size: 70px !important; }

.tc-black { color: #000000 !important; }
.tc-red, .error { color: #CC0000 !important;}
.tc-white { color: #FFFFFF !important; }
.tc-info { color: #CCCCCC !important; }
.tc-success { color: #28A745 !important; }
.tc-warning { color: #FFC107 !important; }
.tc-danger { color: #DC3545 !important; }
.tc-disabled { color: #52565c !important; }
.tc-orange { color: rgb(255, 156, 42) !important; }

.align-l { text-align: left !important; }
.align-c { text-align: center !important; }
.align-r { text-align: right !important; }

.float-l { float: left; }
.float-c { float: center; }
.float-r { float: right; }

.inline { display:inline-block; }
.block { display:block; }

.select_none {
	-ms-user-select: none; /* IE 10+ */
	-moz-user-select: -moz-none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	user-select: none;
 }

.rotate45 {
	transform: rotate(45deg);
}
.rotate90 {
	transform: rotate(90deg);
}
.rotate180 {
	transform: rotate(180deg);
}
.rotate-90 {
	transform: rotate(-90deg);
}
.rotate-45{
	transform: rotate(-45deg);
}

.fs-30 { font-size: 30px !important; }

.w100p { width: 100% !important; }

.w10 { width: 10px !important; }
.w20 { width: 20px !important; }
.w30 { width: 30px !important; }
.w35 { width: 35px !important; }
.w40 { width: 40px !important; }
.w50 { width: 50px !important; }
.w60 { width: 60px !important; }
.w70 { width: 70px !important; }
.w80 { width: 80px !important; }
.w85 { width: 85px !important; }
.w90 { width: 90px !important; }
.w100 { width: 100px !important; }
.w110 { width: 110px !important; }
.w120 { width: 120px !important; }
.w130 { width: 130px !important; }
.w140 { width: 140px !important; }
.w150 { width: 150px !important; }
.w160 { width: 160px !important; }
.w170 { width: 170px !important; }
.w180 { width: 180px !important; }
.w190 { width: 190px !important; }
.w200 { width: 200px !important; }
.w210 { width: 210px !important; }
.w220 { width: 220px !important; }
.w230 { width: 230px !important; }
.w240 { width: 240px !important; }
.w250 { width: 250px !important; }
.w260 { width: 260px !important; }
.w270 { width: 270px !important; }
.w280 { width: 280px !important; }
.w290 { width: 290px !important; }
.w300 { width: 300px !important; }

.mb5 { margin-bottom: 5px !important; }

.p0 { padding: 0 !important; }
.p2 { padding: 2px !important; }
.p10 { padding: 10px !important; }
.pt10 { padding-top: 10px !important; }
.pt12 { padding-top: 12px !important; }
.pt15 { padding-top: 15px !important; }

/* デートピッカー */
.datetimepicker-input:read-only {
  background-color: #FFFFFF;
}
.datetimepicker-input:disabled {
	background-color: #e9ecef;
}

/* container */
.container {
  max-width: 650px;
}

/* contents-inner */
.contents-inner {
	padding-left: 20px;
	padding-right: 20px;
}

/* heading */
.heading {
	color: #333;
	font-weight: bold;
}
.heading.--primary {
	font-size: 24px;
}
.heading.--secondary {
	font-size: 16px;
}

/* item-name */
.item-name {
	color: #333;
	font-weight: bold;
	padding-left: 10px;
	border-left: #0082BD 4px solid;
}
.item-name.--primary {
	font-size: 16px;
}
.item-name.--secondary {
	font-size: 14px;
}

/* anchor */
.anchor {
	color: #333;
	font-size: 14px;
	line-height: 1;
	text-decoration: underline;
	position: relative;
}
.anchor::before {
	content: '';
	position: absolute;
	top: calc(50% - 7px);
	left: -1.25rem;
	width: 8px;
	height: 8px;
	border-top: 1px solid #0082BD;
	border-right: 1px solid #0082BD;
	transform: translateY(50%) rotate(45deg);
}
.anchor-back::before {
	left: -1rem;
	transform: translateY(50%) rotate(225deg);
}

/* form */
.form-control,
.select2-container--bootstrap4 .select2-selection,
.input-group-text {
	color: #000;
	border-color: #c9c9c9;
}
.form-control:focus {
	color: #000;
}

/* color */
.color-black {
	color: #333;
}

/* button */
.btn {
	font-weight: bold;
}
.btn-xs {
	padding: 2px;
	line-height: 100%;
}
.btn:disabled,
.btn.disabled {
	opacity: .3;
}
.btn:disabled:hover,
.btn.disabled:hover {
	cursor: default;
}
.btn-primary,
.btn-primary:disabled,
.btn-primary:disabled:hover,
.btn-primary.disabled,
.btn-primary.disabled:hover {
	background-color: #0082BD;
	border-color: #0082BD;
}
.btn-primary:hover,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary.focus,
.btn-primary:focus {
	background-color: #006BA6;
	border-color: #006BA6;
}
.btn-outline-primary,
.btn-outline-primary:disabled,
.btn-outline-primary:disabled:hover,
.btn-outline-primary.disabled,
.btn-outline-primary.disabled:hover {
	color: #0082BD;
	border-color: #0082BD;
}
.btn-outline-primary:hover,
.btn-outline-primary:not(:disabled):not(.disabled).active,
.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary.focus,
.btn-outline-primary:focus {
	color: #0082BD;
	background-color: #E7F0FA;
	border-color: #0E6BA6;
}
.btn-secondary:hover {
	border-color: #5A6268;
	background-color: #5A6268;
}
.btn-outline-secondary,
.btn-outline-secondary:disabled,
.btn-outline-secondary:disabled:hover,
.btn-outline-secondary.disabled,
.btn-outline-secondary.disabled:hover {
	color: #333;
	background-color: #fff;
	border-color: #767676;
}
.btn-outline-secondary:hover,
.btn-outline-secondary:not(:disabled):not(.disabled).active,
.btn-outline-secondary:not(:disabled):not(.disabled):active,
.btn-outline-secondary.focus,
.btn-outline-secondary:focus {
	color: #333;
	background-color: #F2F2F2;
	border-color: #505050;
}
.btn-color-light-black {
	color: #666;
}
.btn-color-light-black:hover,
.btn-color-light-black:not(:disabled):not(.disabled).active,
.btn-color-light-black:not(:disabled):not(.disabled):active,
.btn-color-light-black.focus,
.btn-color-light-black:focus {
	color: #666;
}
.btn-tertiary {
	color: #fff;
	background-color: #90C425;
}
.btn-tertiary:hover,
.btn-tertiary:not(:disabled):not(.disabled).active,
.btn-tertiary:not(:disabled):not(.disabled):active,
.btn-tertiary.focus,
.btn-tertiary:focus {
	color: #fff;
	background-color: #6E9A13;
}
.btn-lg {
	padding: 14px 10px;
	font-size: 16px;
	line-height: 1;
	font-weight: bold;
	border-radius: 4px;
}
.btn-sm {
	padding: 4px 8px;
	font-size: 12px;
	line-height: 1;
	font-weight: bold;
	border-radius: 4px;
}
.btn-light {
	background-color: #fff;
	border: #767676 1px solid;
}
.btn-light:hover,
.btn-light:not(:disabled):not(.disabled).active,
.btn-light:not(:disabled):not(.disabled):active,
.btn-light.focus,
.btn-light:focus {
	border-color: #505050;
	background-color: #F2F2F2;
}
.btn-icon-img {
	font-size: 0;
	line-height: 0;
	width: 32px;
	height: 32px;
	padding: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}
.btn-icon-img img {
	display: block;
}
.btn-toggle {
	display: block;
	position: relative;
	background-color: #fff;
	width: 32px;
	height: 32px;
	border: 1px solid #767676;
	border-radius: 0.25rem;
	transition: 0.15s;
}
.btn-toggle:hover {
	border-color: #505050;
	background-color: #F2F2F2;
}
.btn-toggle::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(-90deg);
	width: 7px;
	height: 14px;
	background: url('./../images/common/icon/arrow-line_gray01.svg') no-repeat 0 0 / 100% auto;
}
.btn-toggle.is-close::before {
	transform: translate(-50%, -50%) rotate(90deg);
}

/* .badge */
.badge-secondary {
	border-radius: 4px;
	padding: 6px 6px;
	font-size: 12px;
	color: #666;
	background: #F7F7F6;
}

/* list-navi-label */
.list-navi-label {
	color: #666;
	font-size: 14px;
	line-height: 1.2;
	font-weight: bold;
	vertical-align: -2px;
}
.list-navi-label img {
	margin-right: 5px;
	vertical-align: -4px;
}

/* datetimepicker */
/* 下記は _assets/lib/date_time_picker/css/bootstrap-datetimepicker.css を上書き */
.bootstrap-datetimepicker-widget table thead tr:first-child th {
	color: #fff;
	background-color: #666;
}
.bootstrap-datetimepicker-widget table thead tr:first-child th:hover {
	color: #fff;
	background-color: #444;
}
.bootstrap-datetimepicker-widget table thead tr th.dow {
	color: #666;
	background-color: #F7F7F6;
}
.bootstrap-datetimepicker-widget table td span.active,
.bootstrap-datetimepicker-widget table td i.active,
.bootstrap-datetimepicker-widget table td.active,
.bootstrap-datetimepicker-widget table td.active:hover {
	color: #0082BD;
	text-shadow: none;
	font-weight: bold;
}

/* menu-line */
.menu-line {
	display: block;
	position: relative;
	width: 24px;
	height: 19px;
}
.menu-line span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 3px;
	background-color: #0082BD;
	transition: background-color .15s;
}
.menu-line span:nth-child(1) {
	top: 0;
}
.menu-line span:nth-child(2) {
	top: 50%;
	transform: translateY(-50%);
}
.menu-line span:nth-child(3) {
	bottom: 0;
}


.radius-all {
	border-radius: 20px 20px 20px 20px !important;
}
.radius-left {
	border-radius: 20px 0 0 20px !important;
}
.radius-right {
	border-radius: 0 20px 20px 0 !important;
}