@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@200;300;400;500;600;700;800;900&display=swap');


* {
box-sizing: border-box;
	font-family: 'Noto Sans', "Hiragino Sans", '游ゴシック体','游ゴシック', YuGothic,"Hiragino Kaku Gothic ProN", sans-serif;
	font-weight: 400;
}
address, em {
	font-style: normal;
}
.viewpc {
	display: block;
}
.viewtb {
	display: none;
}
.viewsp {
	display: none;
}

/* ---------- color  ---------- */
:root {
  --texcolor01: #333333;
  --texcolor02: #005AFF;
  --texcolor03_blue: #092254;
  --texcolor04_red: #df4150;
  --texcolor05_dullblue: #516cb0;
  --bgcolor01: #F7F7F7;
  --bgcolor02: #EDF3FF;
  --bgcolor03: #F0F0F0;
  --bgcolor04: #CBDDFF;
  --bgcolor05: #FFFCED;
  --bgcolor06: #FFF3BC;
  --bgcolor07: #00369A;
  --bordercolor01: #ADADAD;
  --bordercolor02: #707070;
  --bordercolor03: #D0D0D0;
  --emergencycolor: #FF4B00;
}


/* ---------- reset  ---------- */
html, body {
    width: 100%;
}

html {
	font-size: 62.5%;
	scrollbar-gutter: stable;
}

body {
	background-color: var(--bgcolor01);
	color: var(--texcolor01);
	font-size: 1.6rem;
}

dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,input,p,blockquote,fieldset,div {
	margin: 0;
	padding: 0;
}

table,pre,code,select,option,input,textarea,kbd,var,ins,del,samp {
	font-size: 1.4rem;
}

optgroup {
	font-size: 1.4rem;
	font-weight:bold;
}

h1,h2,h3,h4,h5,h6 {
	font-weight: normal;
	font-size: 1.8rem;
}
p {
	font-size: 1.4rem;
	letter-spacing: -0.01em;
	line-height: 1.8;
	margin: 0 0 1em 0;
	text-align: left;
}
ul li,ol li {
	list-style: none;
}

table,th,td {
	margin: 0;
	padding: 0;
	border-collapse: separate;
	border-spacing: 0;
	text-align: center;
}

th,caption {
	text-align: left;
}

address,cite,dfn,em,b,strong,var,th,ins,del,samp {
	font-weight: normal;
	font-style: normal;
}

img,fieldset {
	border: none;
}
hr {
	border: solid #cdcdcd;
	border-width:1px 0 0 0;
	height: 1px;
	clear: right;
}
.align_center {
	text-align: center;
}

/* Link Style */

a {
	color: var(--texcolor02);
	text-decoration: none;
	outline: none;
}
a:focus {
	outline: none;
}
a:hover {
	color: var(--texcolor02);
	text-decoration: underline;
}

a img {
	border: 0;
}
a:hover img{
	filter: alpha(opacity=60);
	-moz-opacity:0.6;
	opacity:0.6;
	transition: 0.2s all ease 0s;
}
.top_nomargin {
	margin-top: 0!important;
}
.bottom_nomargin {
	margin-bottom: 0!important;
}
.text_strong {
	font-weight: bold;
}
.text_blue {
	color: var(--texcolor03_blue);
}
.text_red {
	color: var(--texcolor04_red);
}
.text_white {
	color: #ffffff;
}
.text_long {
	letter-spacing: -0.1em;
}
.text_underline {
	text-decoration: underline;
}
.align_left {
	text-align: left!important;
}
.align_right {
	text-align: right!important;
}
.blockcontents {
	display: block;
}
.margintop0 {
	margin-top: 0!important;
}
.margintop10 {
	margin-top: 10px!important;
}
.margintop30 {
	margin-top: 30px!important;
}
.margintop40 {
	margin-top: 40px!important;
}
.marginbottom0 {
	margin-bottom: 0!important;
}
.marginbottom20 {
	margin-bottom: 20px!important;
}
.marginbottom60 {
	margin-bottom: 60px!important;
}
.marginbottom80 {
	margin-bottom: 80px!important;
}
.marginleft0 {
	margin-left: 0!important;
}
.margintopmainus30 {
	margin-top: -30px;
}
.cap {
	font-size: 1.4rem;
	line-height: 1.5!important;
	margin: 0 0 6px 0!important;
}
.lineheightshort {
	line-height: 1.5!important;
	margin-bottom: 12px!important;
}
.strong_copy {
	font-size: 2.0rem;
	text-align: center;
}
.big_copy {
	font-size: 2.8rem;
	margin-bottom: 0;
}
*, *:before, *:after {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
 }
 
/* ---------  clearfix --------- */

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
 
.clearfix {
	min-height: 1px;
}
 
* html .clearfix {
	height: 1px;
	/*\*//*/
	height: auto;
	overflow: hidden;
	/**/
}

.clear {
	clear: both;
}

img {
	width: 100%;
	height: auto;
	transition: 0.2s all ease 0s;
}

.inner {
	clear: both;
	width: 1200px;
	margin: 0 auto;
	text-align: left;
	padding: 0;
}



.btn_caparea {
	display: flex;
	flex-flow: column;
	align-items: flex-end;
	margin: 20px auto;
}
.btn_caparea .btn_cap {
	font-size: 1.2rem;
	margin-top: 6px;
	line-height: 1.4;
	text-align: right;
}
.btn_link {
		display: flex;
  justify-content: flex-end;
}
.btn_link a {
	display: inline-block;
	font-size: 1.4rem;
	padding: 8px 40px 8px 8px;
	background: url("../images/common/arrowmark_right_bl.40568c5a8a48.svg") no-repeat 97% center;
	background-size: 20px;
	border: 1px solid var(--texcolor02);
	border-radius: 5px;
	letter-spacing: -0.01em;
	transition: 0.2s all ease 0s;
	color: var(--texcolor01);
		margin-left: auto;
}
.btn_link a:hover {
	background: url("../images/common/arrowmark_right_w.c2ea288eb221.svg") no-repeat 97% center var(--texcolor02);
	background-size: 20px;	
	color: #fff;
	text-decoration: none;
}
.btn_detaillink {
	display: flex;
  justify-content: flex-end;
  text-indent: -9999px;
}
.btn_detaillink a {
	display: inline-block;
	font-size: 1.4rem;
	padding: 4px 18px;
	background: url("../images/common/arrowmark_right_bl.40568c5a8a48.svg") no-repeat center center;
	background-size: 14px;
	border: 1px solid var(--texcolor02);
	border-radius: 5px;
	letter-spacing: -0.01em;
	transition: 0.2s all ease 0s;
	color: var(--texcolor01);
	margin-left: auto;
}
.btn_detaillink a:hover {
	background: url("../images/common/arrowmark_right_w.c2ea288eb221.svg") no-repeat center center var(--texcolor02);
	background-size: 14px;	
	color: #fff;
	text-decoration: none;
}

.btn_back {
		display: block;
}
.btn_back a {
	display: inline-block;
	font-size: 1.4rem;
	padding: 8px 8px 8px 40px;
	background: url("../images/common/arrowmark_left_bl.5d74f69033dd.svg") no-repeat 2% center;
	background-size: 20px;
	border: 1px solid var(--texcolor02);
	border-radius: 5px;
	letter-spacing: -0.01em;
	transition: 0.2s all ease 0s;
	color: var(--texcolor01);
}
.btn_back a:hover {
	background: url("../images/common/arrowmark_left_w.58f552b9fd08.svg") no-repeat 2% center var(--texcolor02);
	background-size: 20px;	
	color: #fff;
	text-decoration: none;
}

/* ===============
Form関連
================*/
input.basic_formtext {
	height: 2.4em;
  width: 100%;
  padding: 0 16px;
  border-radius: 5px;
  border: none;
  box-shadow: 0 0 0 1px #ccc inset;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}
input.basic_formtext:focus {
   outline: 0;
   box-shadow: 0 0 0 2px rgb(33, 150, 243) inset;
}

input.basic_button {
	display: inline;
  width: 100%;
  padding: 8px;
  border: none;
  border-radius: 5px;
  background-color: var(--texcolor02);
  color: #fff;
  font-weight: 500;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  cursor: pointer;
  border: 2px solid transparent;
}
input.basic_button:hover {
	background-color: #000;
}
input.basic_button:focus {
	outline: 0;
  background-color: #000;
  border: 2px solid rgb(33, 150, 243);
}

.basic_select_area {
	position: relative;
}
.basic_select_area:before {
	content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 12px;
  width: 8px;
  height: 8px;
  border-top: 2px solid var(--texcolor02);
  border-right: 2px solid var(--texcolor02);
  transform: rotate(135deg);
  pointer-events: none;
}
.basic_select_area select {
  height: 2.4em;
  width: 100%;
  padding: 0 8px;
  border-radius: 4px;
  border: none;
  box-shadow: 0 0 0 1px #707070 inset;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  cursor: pointer;
}
.basic_select_area select::-ms-expand {
   display: none;
}
.basic_select_area  select:focus {
    outline: 0;
    box-shadow: 0 0 0 2px rgb(33, 150, 243) inset;
}


/* ===============
table関連
================*/
table.basic_table {
	border-collapse: collapse;
	width: 100%;
	margin-bottom: 40px;
}
table.basic_table tr:nth-child(even) {
	background-color: var(--bgcolor01);
}
table.basic_table th {
	font-size: 1.6rem;
	padding: 12px 6px;
	background-color: var(--bgcolor03);
	text-align: center;
	font-weight: 700;
	border-bottom: 1px solid var(--bordercolor01);
}
table.basic_table td {
	padding: 12px 6px;
	border-bottom: 1px solid var(--bordercolor01);
}
table.link_table tr:hover {
	background-color: var(--bgcolor02);
	cursor: pointer;
  }
table.link_table tr.current {
	border: 3px solid var(--texcolor02);
}
table.link_table tr.link_tr:hover {
	cursor: pointer;
	background-color: var(--bgcolor02);
}

table.civilprotec_table td.nowrap {
	white-space: nowrap;
}


/* ===============
header
================*/
header {
	width: 100%;
	background-color: rgba(255,255,255,0.9);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100;
}
header .inner {
	width: 98%;
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
header h1 {
	flex-basis: 320px;
	margin: 10px auto 10px 0;
	font-size: 3.6rem;
	font-weight: 700;
	line-height: 1.2;
	white-space: nowrap;
}
header h1 a {
	font-weight: 700;
	color: #000;
}
header h1 a:hover {
	color: #000;
	text-decoration: none;
	opacity: 0.6;
}

header .reload_contents {
	flex-basis: 100px;
	margin-right: 10px;
	margin-left: auto;
}
header .reload_contents .btn_reload a {
	display: inline-block;
	font-size: 1.4rem;
	font-weight: 700;
	padding: 8px 10px 8px 40px;
	background: url("../images/common/icon_reload.1aa8e23f1a32.svg") no-repeat 8px center;
	background-size: 20px;
	border: 1px solid var(--texcolor02);
	border-radius: 5px;
	letter-spacing: -0.01em;
	transition: 0.2s all ease 0s;
	color: var(--texcolor01);
	margin-left: auto;
}
header .reload_contents .btn_reload a:hover {
	background: url("../images/common/icon_reload_w.28c931bc156e.svg") no-repeat 8px center var(--texcolor02);
	background-size: 20px;	
	color: #fff;
	text-decoration: none;
}

header .data_time {
	font-size: 1.2rem;
}
header .data_time span {
	font-size: 1.4rem;
}

header .logo_jed {
	width: 85px;
	margin: 0 0 0 10px;
}


/* ===============
main
================*/
main {
	width: 100%;
	padding-top: 120px;
	background-color: var(--bgcolor01);
}
main.index_main {
		padding-top: 120px;
}
main .inner {
	display: flex;
	justify-content: space-between;
}
main #nav_area {
	flex-basis: 290px;
	width: 290px;
	background-color: #fff;
	margin-bottom: 28px;
}
main #maincontents_area {
	flex-basis: 880px;
}

main .bread_crumb {
	width: 1200px;
	height: 47px;
	margin: 0 auto 14px auto;
	background-color: #fff;
	border-radius: 100px;
	padding: 14px 30px;
}
main .bread_crumb ul {
	width: 100%;
	display: flex;
	justify-content: flex-start;
}
main .bread_crumb ul li {
	margin-right: 30px;
}
main .bread_crumb ul li a {
	text-decoration: underline;
	position: relative;
	display: block;
}
main .bread_crumb ul li a:hover {
	text-decoration: none;
}
main .bread_crumb ul li a::after {
	position: absolute;
	content: ">";
	right: -20px;
	top: 0;
}

/* ===============
#nav_area
================*/
#nav_area nav ul {
	border-top: 1px solid var(--texcolor02);
}
#nav_area nav ul li {
	border-bottom: 1px solid var(--texcolor02);	
}
#nav_area nav ul li a {
	width: 100%;
	height: 62px;
	padding-left: 54px;
	display: flex;
	color: #000;
	font-size: 1.7rem;
	font-weight: 700;
	align-items: center;
	justify-content: flex-start;
	letter-spacing: -0.01em;
	transition: 0.2s all ease 0s;
}
#nav_area nav ul li a:hover {
	background-color: var(--texcolor02);
	color: #fff;
	text-decoration: none;
}
#nav_area nav ul li a.current {
	background-color: var(--texcolor02);
	color: #fff;
}

#nav_area nav ul li.nav_home a {
	background: url("../images/common/icon_home.c40a7e940ad8.svg") no-repeat 18px center;
	background-size: 21px;
}
#nav_area nav ul li.nav_home a:hover,
#nav_area nav ul li.nav_home.current a {
	background: url("../images/common/icon_home_w.9bff4b91c9a5.svg") no-repeat 18px center var(--texcolor02);
	background-size: 21px;
	color: #fff;
}

#nav_area nav ul li.nav_earthquake a {
	background: url("../images/common/icon_earthquake.c9daaa23f04b.svg") no-repeat 14px center;
	background-size: 30px;
}
#nav_area nav ul li.nav_earthquake a:hover,
#nav_area nav ul li.nav_earthquake.current a {
	background: url("../images/common/icon_earthquake_w.af965ba37eab.svg") no-repeat 14px center var(--texcolor02);
	background-size: 30px;
	color: #fff;
}
#nav_area nav ul li.nav_tsunami a {
	background: url("../images/common/icon_tsunami.999de5a6a344.svg") no-repeat 14px center;
	background-size: 28px;
}
#nav_area nav ul li.nav_tsunami a:hover,
#nav_area nav ul li.nav_tsunami.current a {
	background: url("../images/common/icon_tsunami_w.ff3c26bfaed4.svg") no-repeat 14px center var(--texcolor02);
	background-size: 28px;
	color: #fff;
}
#nav_area nav ul li.nav_volcano a {
	background: url("../images/common/icon_volcano.c3a498e6718a.svg") no-repeat 14px center;
	background-size: 28px;
}
#nav_area nav ul li.nav_volcano a:hover,
#nav_area nav ul li.nav_volcano.current a {
	background: url("../images/common/icon_volcano_w.4a7b82e7c8c9.svg") no-repeat 14px center var(--texcolor02);
	background-size: 28px;
	color: #fff;
}
#nav_area nav ul li.nav_special a {
	background: url("../images/common/icon_special.7ba6ebfb39d6.svg") no-repeat 14px center;
	background-size: 28px;
}
#nav_area nav ul li.nav_special a:hover,
#nav_area nav ul li.nav_special.current a {
	background: url("../images/common/icon_special_w.65b2694bb35f.svg") no-repeat 14px center var(--texcolor02);
	background-size: 28px;
	color: #fff;
}
#nav_area nav ul li.nav_heatstroke a {
	background: url("../images/common/icon_heatstroke.4064fc0707a2.svg") no-repeat 14px center;
	background-size: 28px;
}
#nav_area nav ul li.nav_heatstroke a:hover,
#nav_area nav ul li.nav_heatstroke.current a {
	background: url("../images/common/icon_heatstroke_w.95d1ac6665fb.svg") no-repeat 14px center var(--texcolor02);
	background-size: 28px;
	color: #fff;
}
#nav_area nav ul li.nav_civilprotec a {
	background: url("../images/common/icon_civilprotec.d2e1c1a867a5.svg") no-repeat 16px center;
	background-size: 22px;
}
#nav_area nav ul li.nav_civilprotec a:hover,
#nav_area nav ul li.nav_civilprotec.current a {
	background: url("../images/common/icon_civilprotec_w.86edb2b8c610.svg") no-repeat 16px center var(--texcolor02);
	background-size: 22px;
	color: #fff;
}
#nav_area nav ul li.nav_lalert a {
	background: url("../images/common/icon_lalert.28cc469ddd18.svg") no-repeat 16px center;
	background-size: 22px;
}
#nav_area nav ul li.nav_lalert a:hover,
#nav_area nav ul li.nav_lalert.current a {
	background: url("../images/common/icon_lalert_w.4a7c8cab08a9.svg") no-repeat 16px center var(--texcolor02);
	background-size: 22px;
	color: #fff;
}

#nav_area .twitter_area {
	margin: 30px 0;
}
#nav_area .twitter_area h2 {
	text-align: center;
	font-weight: 700;
	letter-spacing: -0.01em;
}
#nav_area .twitter_area p {
	text-align: center;
	margin: 10px auto;
}
#nav_area .twitter_area .twitter_embedarea {
	width: 282px;
	padding-right: 14px;
	padding-left: 14px;
	margin: 0 auto;
}
#nav_area .twitter_area .btn_link {
	width: 233px;
	margin-top: 14px;
	margin-left: auto;
	margin-right: 22px;
}

#nav_area .socialaccount_area {
	margin: 30px 0;
}
#nav_area .socialaccount_area h2 {
	text-align: center;
	font-weight: 700;
	letter-spacing: -0.01em;
}
#nav_area .socialaccount_area ul {
	width: 100%;
	margin-top: 14px;
}
#nav_area .socialaccount_area ul li {
	margin-bottom: 6px;
}
#nav_area .socialaccount_area ul li a {
	font-size: 1.4rem;
	letter-spacing: -0.005em;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	padding-left: 60px;
	transition: 0.2s all ease 0s;
	color: var(--texcolor01);
}
#nav_area .socialaccount_area ul li a span {
	flex-basis: 44px;
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	text-align: center;
	margin-right: 10px;
}
#nav_area .socialaccount_area ul li a span img {
	width: 18px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
#nav_area .socialaccount_area ul li.link_weibo a span img {
	width: 22px;
}
#nav_area .socialaccount_area ul li a:hover {
	text-decoration: none;
	background-color: var(--bgcolor02);
}
#nav_area .socialaccount_area ul li a:hover span img {
	opacity: 1;
}

/* ===============
#maincontents_area
================*/

.main_article {
	width: 100%;
	background-color: #fff;
	padding: 20px 25px 25px 25px;
	margin-bottom: 20px;
}
.main_article h2 {
	font-size: 2.4rem;
	font-weight: 700;
	position: relative;
	line-height: 15px;
	padding-left: 4px;
	margin-bottom: 16px;
}
.main_article h2:before {
	display: block;
	content: "";
	width: 25px;
	height: 14px;
	background-color: var(--texcolor02);
	position: absolute;
	left: -25px;
	top: 15%;
}
.main_article h2.h2_em:before {
	display: block;
	content: "";
	width: 25px;
	height: 14px;
	background-color: var(--emergencycolor);
	position: absolute;
	left: -25px;
	top: 15%;
}
.main_article .btn_question {
	display: inline-block;
	margin-left: 10px;
}
.main_article .btn_question a {
	display: inline-block;
	width: 36px;
	height: 36px;
	border: 1px solid var(--texcolor02);
	border-radius: 5px;
	display: flex;
	align-items: center;
	text-align: center;
	background: url("../images/common/icon_question_bl.8f2639880822.svg") no-repeat center center #fff;
	background-size: 12px;
	text-indent: -9999px;
 	transition: all .2s ease;
}
.main_article .btn_question a:hover {
	background: url("../images/common/icon_question_w.585ad19a1647.svg") no-repeat center center var(--texcolor02);
	background-size: 12px;	
}

.main_article h3 {
	font-size: 1.8rem;
	font-weight: 700;
	margin-bottom: 20px;
	position: relative;
 padding: 10px 0 4px 0px;
 border-bottom: 2px solid var(--bordercolor03);
}
.main_article h3 span {
	display: inline-block;
 position: relative;
 font-weight: 700;
	font-size: 1.8rem;
}
.main_article h3 span::after {
	content: "";
 position: absolute;
 left: 0;
 bottom: -6px;
 width: 100%;
 height: 2px;
 background: var(--texcolor02);
}

.main_article h4 {
	font-size: 1.6rem;
	font-weight: 700;
	margin-bottom: 6px;
	color: var(--texcolor05_dullblue);
}

.main_article .about_column {
	width: 100%;
	margin: 20px auto 10px auto;
	padding: 10px 10px 0 10px;
	border: 1px solid var(--bordercolor01);
}

.main_article .about_column label.about_title {
	display: inline-block;
    cursor :pointer;
    transition: all 0.3s;
	font-size: 1.6rem;
	font-weight: 700;
	background: url("../images/common/icon_plus.a2b3b078f6a2.svg") no-repeat right center;
	background-size: 20px;
	padding-right: 30px;
	transition: 0.2s all ease 0s;
	line-height: 1.5
}


.main_article .about_column .cssacc:checked + label.about_title {
	background: url("../images/common/icon_minus.6c48243adc2f.svg") no-repeat right center;
	background-size: 20px;
	margin: 0;  
}

.main_article .about_column input {
    display: none;
}
.main_article .about_column .accshow {
	width: 100%;
	height: 0;
	padding: 0;
	overflow: hidden;
	opacity: 0;
	transition: 0.8s;
	margin: 10px 0 0 0;
}
.main_article .about_column .cssacc:checked + label + .accshow {
	height: auto;
	opacity: 1;
	margin: 10px 0 0 0;
}
.main_article .about_column .accshow p {
 	margin: 0 0 16px 0;
 	line-height: 1.5;
}


/* emergency_article */
.emergency_article {
	padding-bottom: 15px;
}
.emergency_item {
	margin-bottom: 10px;
}
.emergency_category {
	display: inline-block;
	background-color: var(--emergencycolor);
	color: #fff;
	font-size: 1.7rem;
	font-weight: 700;
	padding: 4px 12px;
	margin-right: 12px;
	margin-bottom: 4px;
}
.emergency_place {
	color: var(--texcolor01);
	font-size: 1.7rem;
	font-weight: 700;
}
dl.emergency_detail {
	width: 100%;
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
dl.emergency_detail dt {
	width: 146px;
	text-align: left;
	color: var(--texcolor01);
	border-right: 1px solid var(--bordercolor02);
	margin-right: 20px;
	line-height: 1.3;
}
dl.emergency_detail dd {
	line-height: 1.3;
}
dl.emergency_detail dd a {
	text-decoration: underline;
}
dl.emergency_detail dd a:hover {
	text-decoration: none;
}


.readmore {
 display: block;
 border: none;
 background-color: #fff;
 margin: 0 auto;
}

.readmore .open {
	display: block;
 	padding: 0 40px 0 10px;
	width: 180px;
	margin: 0 auto;
	line-height: 30px;
	font-size: 1.4rem;
	background: url("../images/common/icon_plus.a2b3b078f6a2.svg") no-repeat 95% center #fff;
	background-size: 18px;
	border: 1px solid var(--texcolor02);
	border-radius: 5px;
	text-align: center;
	transition: 0.2s all ease 0s;
	cursor: pointer;
}
.readmore .open:hover {
	background: url("../images/common/icon_plus.a2b3b078f6a2.svg") no-repeat 95% center var(--texcolor02);
	background-size: 18px;
	border: 1px solid var(--texcolor02);	
	color: #fff;
}
.readmore.on-click .open {
  display: none;
}
.readmore .close {
  display: none;
}
.readmore.on-click .close {
	display: block;
  padding: 0 40px 0 10px;
 width: 180px;
	margin: 0 auto;
	line-height: 30px;
	font-size: 1.4rem;
	background: url("../images/common/icon_minus.6c48243adc2f.svg") no-repeat 95% center #fff;
	background-size: 18px;
	border: 1px solid var(--texcolor02);
	border-radius: 5px;
	text-align: center;
	transition: 0.2s all ease 0s;
	cursor: pointer;
}
.readmore.on-click .close:hover {
		background: url("../images/common/icon_minus.6c48243adc2f.svg") no-repeat 95% center var(--texcolor02);
	background-size: 18px;
	border: 1px solid var(--texcolor02);	
	color: #fff;
}


/* currentlocation_article */
.map_nav {
	width: 100%;
	margin-left: auto;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	z-index: 1;
}
.map_nav .location_menu {
	flex-basis: 330px;
	width: 330px;
	display: flex;
	justify-content: flex-start;
	flex-flow: column;
}
.map_nav .location_menu .locmenu_title {
	color: var(--texcolor02);
	display: block;
	font-weight: 600;
	width: 80px;
	height: 31px;
	text-align: center;
	padding: 6px 8px;
	border-radius: 5px 5px 0 0;
	border-top: 1px solid var(--texcolor02);
	border-left: 1px solid var(--texcolor02);
	border-right: 1px solid var(--texcolor02);
}

.map_menu {
	display: inline-block;
	z-index: 1;
}
.map_menu li.menu_top {
	width: 330px;
 	border-radius: 0 5px 0 0;
  	border-top: 1px solid var(--texcolor02);
  	z-index: 1;
}
.map_menu li.menu_top > a {
	font-weight: 700;
	border-radius: 0 5px 0 0;
}
.map_menu > li {
   position: relative;
}
.map_menu li > a {
	width: 330px;
	height: 49px;
	display: flex;
	transition: 0.2s all ease 0s;
	border-left: 1px solid var(--texcolor02);
	border-right: 1px solid var(--texcolor02);
	align-items: center;
	background-color: #fff;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--texcolor01);
}
.map_menu li a:hover {
	background-color: #e2e9ff;
	transition: all .2s ease;
	cursor: pointer;
	text-decoration: none;
}
.map_menu li:hover > ul {
	visibility: visible;
	top: 49px;
	opacity: 1;
	transition: all .2s ease;
	border-top: 1px solid var(--texcolor02);
	background-color: var(--bgcolor02);
	z-index: 1;
}
.map_menu ul {
   visibility: visible;
   position: absolute;
   top: 50px;
   width: 330px;
   opacity: 1;
   z-index: 1;
}

ul.map_menu li.menu_earthquake a:hover,
ul.map_menu li.menu_earthquake.menu_on a:hover,
ul.second-level li.menu_tsunami a:hover,
ul.second-level li.menu_tsunami.menu_on a:hover,
ul.second-level li.menu_volcano a:hover,
ul.second-level li.menu_volcano.menu_on a:hover,
ul.second-level li.menu_special a:hover,
ul.second-level li.menu_special.menu_on a:hover,
ul.second-level li.menu_civilprotec a:hover,
ul.second-level li.menu_civilprotec.menu_on a:hover,
ul.second-level li.menu_lalert a:hover,
ul.second-level li.menu_lalert.menu_on a:hover {
	background-color: var(--bgcolor02);
}
ul.map_menu li.menu_current > a {
	background-color: var(--emergencycolor)!important;
	color: #fff;
}
ul.map_menu li.menu_earthquake a {
	background: url("../images/common/icon_earthquake.c9daaa23f04b.svg") no-repeat 9px center #fff;
	background-size: 32px;
  	padding-left: 60px;
  	transition: all .2s ease;
}
ul.map_menu li.menu_earthquake.menu_current > a {
	background: url("../images/common/icon_earthquake_w.af965ba37eab.svg") no-repeat 9px center var(--texcolor02);
	background-size: 32px;
  	padding-left: 60px;
}
ul.map_menu li.menu_earthquake.menu_on > a {
	background: url("../images/common/icon_earthquake_on.318482f6ee07.svg") no-repeat 9px center #fff;
	background-size: 32px;
  	padding-left: 60px;
  	border-bottom: 1px solid var(--texcolor02);
}
ul.map_menu li.menu_earthquake.menu_on.menu_current > a {
	background: url("../images/common/icon_earthquake_on_w.cdd125f8426a.svg") no-repeat 9px center var(--texcolor02);
	background-size: 32px;
  	padding-left: 60px;
  	border-bottom: 1px solid var(--texcolor02);
  	transition: all .2s ease;
}
ul.second-level li.menu_tsunami a {
	background: url("../images/common/icon_tsunami.999de5a6a344.svg") no-repeat 9px center #fff;
	background-size: 32px;
  	padding-left: 60px;
  	border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_tsunami.menu_current a {
	background: url("../images/common/icon_tsunami_w.ff3c26bfaed4.svg") no-repeat 9px center var(--texcolor02);
	background-size: 32px;
  	padding-left: 60px;
  	border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_tsunami.menu_on a {
	background: url("../images/common/icon_tsunami_on.fc75172ab8ca.svg") no-repeat 9px center #fff;
	background-size: 32px;
  	padding-left: 60px;
  	border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_tsunami.menu_on.menu_current a {
	background: url("../images/common/icon_tsunami_on_w.5349f7ead37f.svg") no-repeat 9px center #fff;
	background-size: 32px;
  	padding-left: 60px;
  	border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_volcano a {
	background: url("../images/common/icon_volcano.c3a498e6718a.svg") no-repeat 9px center #fff;
	background-size: 33px;
  padding-left: 60px;
  border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_volcano.menu_current a {
	background: url("../images/common/icon_volcano_w.4a7b82e7c8c9.svg") no-repeat 9px center #fff;
	background-size: 33px;
  padding-left: 60px;
  border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_volcano.menu_on a {
	background: url("../images/common/icon_volcano_on.4c9fc0813ba0.svg") no-repeat 9px center #fff;
	background-size: 33px;
  padding-left: 60px;
  border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_volcano.menu_on.menu_current a {
	background: url("../images/common/icon_volcano_on_w.aea9103b71a9.svg") no-repeat 9px center #fff;
	background-size: 33px;
  padding-left: 60px;
  border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_special a {
	background: url("../images/common/icon_special.7ba6ebfb39d6.svg") no-repeat 11px center #fff;
	background-size: 33px;
  padding-left: 60px;
  border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_special.menu_current a {
	background: url("../images/common/icon_special_w.65b2694bb35f.svg") no-repeat 11px center #fff;
	background-size: 33px;
  padding-left: 60px;
  border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_special.menu_on a {
	background: url("../images/common/icon_special_on.8359dea3bf13.svg") no-repeat 11px center #fff;
	background-size: 33px;
  padding-left: 60px;
  border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_special.menu_on.menu_current a {
	background: url("../images/common/icon_special_on_w.dfd0fe4ebeb0.svg") no-repeat 11px center #fff;
	background-size: 33px;
  padding-left: 60px;
  border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_civilprotec a {
	background: url("../images/common/icon_civilprotec.d2e1c1a867a5.svg") no-repeat 14px center #fff;
	background-size: 28px;
  padding-left: 60px;
  border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_civilprotec.menu_current a {
	background: url("../images/common/icon_civilprotec_w.86edb2b8c610.svg") no-repeat 14px center #fff;
	background-size: 28px;
  padding-left: 60px;
  border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_civilprotec.menu_on a {
	background: url("../images/common/icon_civilprotec_on.b8428fe3ca4a.svg") no-repeat 14px center #fff;
	background-size: 28px;
  padding-left: 60px;
  border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_civilprotec.menu_on.menu_current a {
	background: url("../images/common/icon_civilprotec_on_w.8a3182235d61.svg") no-repeat 14px center #fff;
	background-size: 28px;
  padding-left: 60px;
  border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_lalert a {
	background: url("../images/common/icon_lalert.28cc469ddd18.svg") no-repeat 14px center #fff;
	background-size: 28px;
  padding-left: 60px;
  border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_lalert.menu_current a {
	background: url("../images/common/icon_lalert_w.4a7c8cab08a9.svg") no-repeat 14px center #fff;
	background-size: 28px;
  padding-left: 60px;
  border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_lalert.menu_on a {
	background: url("../images/common/icon_lalert_on.536d7c112d02.svg") no-repeat 14px  center #fff;
	background-size: 28px;
  padding-left: 60px;
  border-bottom: 1px solid var(--texcolor02);
}
ul.second-level li.menu_lalert.menu_on.menu_current a {
	background: url("../images/common/icon_lalert_on_w.56c6daedb35b.svg") no-repeat 14px center #fff;
	background-size: 28px;
  padding-left: 60px;
  border-bottom: 1px solid var(--texcolor02);
}


.prefecture_menu {
  position: relative;
  width: 136px;
  display: flex;
  align-items: center;
  border-left: 1px solid var(--texcolor02);
  border-top: 1px solid var(--texcolor02);
  border-right: 1px solid var(--texcolor02);
  border-radius: 5px 5px 0 0;
  margin-left: auto;
}
.station_menu  {
  position: relative;
  width: 310px;
  display: flex;
  align-items: center;
  border-left: 1px solid var(--texcolor02);
  border-top: 1px solid var(--texcolor02);
  border-right: 1px solid var(--texcolor02);
  border-radius: 5px 5px 0 0;
}
.prefecture_menu select,
.station_menu  select {
	width: 100%;
	padding: 10px 30px 10px 10px;
	color: var(--texcolor01);
	cursor: pointer;
	z-index: 1;
	border: none;
	appearance: none;
	outline: none;
	background: transparent;
	font-size: 1.4rem;
	font-weight: 700;
	background: url("../images/common/arrow_down_bl.7d437d618f1a.svg") no-repeat 96% center;
	background-size: 16px;
}


.location_current {
	flex-basis: 44px;
	width: 100%;
	font-size: 1.4rem;
	font-weight: 700;
	letter-spacing: -0.01em;
	line-height: 38px;
}
.location_current .btn_mapcurrent {
	display: inline-block;
}
.location_current .btn_mapcurrent a {
	display: inline-block;
	width: 44px;
	height: 38px;
	border-top: 1px solid var(--texcolor02);
	border-right: 1px solid var(--texcolor02);
	border-left: 1px solid var(--texcolor02);
	border-radius: 5px 5px 0 0;
	display: flex;
	align-items: center;
	text-align: center;
	background: url("../images/common/icon_current_bl.6daaa9c2d19f.svg") no-repeat center center #fff;
	background-size: 30px;
	text-indent: -9999px;
 	transition: all .2s ease;
}
.location_current .btn_mapcurrent a:hover {
	background: url("../images/common/icon_current_w.ac839ecb2840.svg") no-repeat center center var(--texcolor02);
	background-size: 30px;	
}

.index_maparea {
	width: 100%;
	border: 1px solid var(--texcolor02);
	position: relative;
	margin: 0 auto 40px auto;
	overflow: hidden;
}
.index_maparea .map_detail {
	width: 100%;
	position: relative;
}
.index_maparea .map_detail #mapid {
	border-bottom: 1px solid var(--bordercolor03);
}

.index_maparea .map_sample {
	width: 50%;
	margin: 10px 10px 10px auto;
}
.index_maparea .map_part {
	width: 280px;
	height: auto;
	position: absolute;
	left: 0;
	top: 0;
	overflow: hidden;
}
.index_maparea .map_part img {
	border-right: 1px solid var(--texcolor02);
	border-bottom: 1px solid var(--texcolor02);
}
.index_maparea .map_notcurrently img {
	opacity: 0.2;
	border-bottom: 1px solid var(--texcolor01);
}
.index_maparea .map_attention {
	position: absolute;
	top: 45%;
	left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}
.index_maparea .map_attention p {
	font-size: 1.8rem;
}

/* Map Popup */

.index_maparea .map_marker {
	position: absolute;
	width: 36px;
	height: auto;
	z-index: 3;
	cursor: pointer;
}
.index_maparea .map_alert_sample {
	position: absolute;
	width: 54px;
	height: auto;
	z-index: 3;
	cursor: pointer;	
}

.index_maparea .map_popup {
	position: absolute;
	background-color: var(--bgcolor01);
	border-radius: 6px;
	padding: 20px 14px;
	display: inline-block;
	margin: 1.5em 0;
	padding: 12px;
	box-shadow: 3px 2px 2px var(--bordercolor01);
}
.index_maparea .map_popup.popup_specialalert01 {
	display: none;
	left: 295px;
	top: 90px;
}
.index_maparea .map_popup.popup_volcano01 {
	display: none;
	left: 150px;
	top: 365px;	
}
.index_maparea .map_popup.popup_volcano02 {
	display: none;
	left: 203px;
	top: 394px;	
}
.index_maparea .map_popup:before {
	content: "";
	position: absolute;
	bottom: -24px;
	left: 50%;
	margin-left: -12px;
	border: 12px solid transparent;
	border-top: 12px solid rgba(255,255,255,0.95);
	z-index: 2;
}
.index_maparea .map_popup:after {
	content: "";
	position: absolute;
	bottom: -30px;
	left: 50%;
	margin-left: -17px;
	border: 14px solid transparent;
	border-top: 14px solid var(--bordercolor01);
	z-index: 1;
}

.index_maparea .map_popup.active_popup {
	display: block;
}

.index_maparea .map_popup table.popup_table {
	margin-bottom: 0;
	font-size: 1.3rem;
	border-top: 1px solid var(--bordercolor01);
	background-color: #fff;
}
.index_maparea .map_popup table.popup_table th {
	padding: 8px 18px;
	width: 120px;
	font-size: 1.3rem;
	background-color: var(--bgcolor04);
	text-align: left;
}
.index_maparea .map_popup table.popup_table td {
	padding: 8px 18px;
	font-size: 1.3rem;
	text-align: left;
	background-color: #fff!important
}
.index_maparea .map_popup table.alert_table {
	border-top: 1px solid var(--emergencycolor);
}
.index_maparea .map_popup table.alert_table th {
	background-color: var(--bgcolor06);
	border-bottom: 1px solid var(--emergencycolor);
}
.index_maparea .map_popup table.alert_table td {
	border-bottom: 1px solid var(--emergencycolor);
	color: var(--emergencycolor);
	font-weight: 700;
}


.earthquake_level_sample {
	margin: 10px 10px 0 auto;
}
.earthquake_level_sample ul {
	display: flex;
	gap: 10px;
}
.earthquake_level_sample ul li {
	width: 100%;
	display: flex;
	justify-content: center;
	flex-direction: column;
	text-align: center;
	flex-wrap: wrap;
	align-items: center;
	margin-bottom: 6px;
}
.earthquake_level_sample ul li:last-child {
	margin-bottom: 0;
}
.earthquake_level_sample .mark_level07 {
	flex-basis: 20px;
	width: 20px;
	height: 20px;
	border: 1px solid var(--bordercolor01);
	border-radius: 30px;
	background-color: #b40068;
}
.earthquake_level_sample .mark_level06-p {
	flex-basis: 20px;
	width: 20px;
	height: 20px;
	border: 1px solid var(--bordercolor01);
	border-radius: 30px;
	background-color: #A50021;
}
.earthquake_level_sample .mark_level06-m {
	flex-basis: 20px;
	width: 20px;
	height: 20px;
	border: 1px solid var(--bordercolor01);
	border-radius: 30px;
	background-color: #ff2800;
}
.earthquake_level_sample .mark_level05-p {
	flex-basis: 20px;
	width: 20px;
	height: 20px;
	display: block;
	border: 1px solid var(--bordercolor01);
	border-radius: 30px;
	background-color: #FF9900;
}
.earthquake_level_sample .mark_level05-m {
	flex-basis: 20px;
	width: 20px;
	height: 20px;
	display: block;
	border: 1px solid var(--bordercolor01);
	border-radius: 30px;
	background-color: #FFE600;
}
.earthquake_level_sample .mark_level04 {
	flex-basis: 20px;
	width: 20px;
	height: 20px;
	display: block;
	border: 1px solid var(--bordercolor01);
	border-radius: 30px;
	background-color: #fae696;
}
.earthquake_level_sample .mark_level03 {
	flex-basis: 20px;
	width: 20px;
	height: 20px;
	display: block;
	border: 1px solid var(--bordercolor01);
	border-radius: 30px;
	background-color: #0041FF;
}
.earthquake_level_sample .mark_level02 {
	flex-basis: 20px;
	width: 20px;
	height: 20px;
	display: block;
	border: 1px solid var(--bordercolor01);
	border-radius: 30px;
	background-color: #05AAFF;
}
.earthquake_level_sample .mark_level01 {
	flex-basis: 20px;
	width: 20px;
	height: 20px;
	display: block;
	border: 1px solid var(--bordercolor01);
	border-radius: 30px;
	background-color: #F2F2FF;
}
.earthquake_level_sample .mark_epicenter {
	flex-basis: 20px;
	width: 20px;
	height: 24px;
	display: block;
}
.earthquake_level_sample .mark_station {
	flex-basis: 14px;
	width: 14px;
	height: 21px;
	display: block;
	margin-top: -3px;
}
.earthquake_level_sample .mark_detail {
	flex-basis: auto;
	font-size: 1.4rem;
	line-height: 1.3;
	margin: 0 auto;
	display: inline-block;
	text-align: center;
}





.response_img {
	width: 100%;
	margin: 0 auto;
}
.response_img img.responseimg_s {
	max-width: 600px;
	margin: 0 auto;
	display: block;
}



/* contactlist_article */

.contact_item {
	margin-bottom: 10px;
}
.contact_item label {
    display: block;
    cursor :pointer;
    transition: all 0.3s;
    font-size: 1.4rem; 
}

.contact_item label p {
	padding: 10px 20px 10px 20px;
	font-size: 1.8rem;
	font-weight: 700;
	background: url("../images/common/icon_plus.a2b3b078f6a2.svg") no-repeat 98% center var(--bgcolor02);
	background-size: 20px;
	margin: 0;
	transition: 0.2s all ease 0s;
}
.emergency_item label p {
	padding: 8px 20px 8px 20px;
	font-size: 1.8rem;
	font-weight: 700;
	background: url("../images/common/icon_plus_r.2ee44f18ec22.svg") no-repeat 98% center var(--bgcolor05);
	background-size: 20px;
	margin: 0;
	transition: 0.2s all ease 0s;
	border: 2px solid var(--emergencycolor);
	color: var(--emergencycolor);
}
.contact_item label p:hover {
	background-color: var(--bgcolor04);
	transition: 0.2s all ease 0s;
}
.emergency_item label p:hover {
	background-color: var(--bgcolor06);
	transition: 0.2s all ease 0s;
}

.contact_item .cssacc:checked + label p {
	background: url("../images/common/icon_minus.6c48243adc2f.svg") no-repeat 98% center var(--bgcolor02);
	background-size: 20px;
	margin: 0;  
}
.emergency_item .cssacc:checked + label p {
	background: url("../images/common/icon_minus_r.e55e1f26d4cd.svg") no-repeat 98% center var(--bgcolor05);
	background-size: 20px;
	margin: 0;  
}

.contact_item input {
    display: none;
}
.contact_item .accshow {
	width: 100%;
	height: 0;
	padding: 0;
	overflow: hidden;
	opacity: 0;
	transition: 0.8s;
	margin: 16px 0 0 0;
}
.contact_item .cssacc:checked + label + .accshow {
	height: auto;
	opacity: 1;
	margin: 16px 0 0 0;
}
.contact_item .accshow h3 {
	font-size: 2.0rem;
	font-weight: 700;
	margin-top: 20px;
	margin-bottom: 14px;
}
.contact_item .accshow p {
 	margin: 16px 0 16px 0;
}
.contact_item .accshow p a {
	color: var(--texcolor02);
	text-decoration: underline;
}
.contact_item .accshow p a:hover {
	text-decoration: none;
}
.contact_item .accshow .contact_link {
	text-align: right;
	margin-bottom: 10px;
}
.contact_item .accshow .contact_link a {
	display: inline-block;
	margin-left: auto;
	background-image: url("../images/common/icon_whindowopen.1f62326d2275.svg"),
	url("../images/common/arrow_right_bl.2dcd56c6eb61.svg");
	background-size: 20px, 8px;
	background-repeat: no-repeat, no-repeat;
	background-position: right center ,left center;
	color: var(--texcolor02);
	padding: 0 30px 0 16px;
	text-decoration: underline;
}
.contact_item .accshow .contact_link a:hover {
	text-decoration: none;
}

/* ===================
footer
====================== */
footer {
	width: 100%;
	background-color: var(--bgcolor01);
	min-width: 1200px;
}

footer .totop_area {
	width: 1200px;
	margin: 0 auto;
}
footer .totop_area .totop a {
	display: block;
	font-size: 1.4rem;
	margin: 0 0 0 auto;
	width: 150px;
	height: 40px;
	padding: 12px 8px 4px 40px;
	background: url("../images/common/arrowmark_top_w.48d8e7a31744.svg") no-repeat 14px center var(--texcolor02);
	background-size: 12px;
	letter-spacing: -0.01em;
	color: #fff;
	border-radius: 4px 4px 0 0;
	transition: 0.2s all ease 0s;
}
footer .totop_area .totop a:hover {
	text-decoration: none;
	height: 50px;
	margin-top: -10px;
}
footer .footerlink_area {
	background-color: #E0EBFF;
	border-top: 2px solid var(--texcolor02);
}
footer .footerlink_area .inner {

	margin: 0 auto;
	padding: 50px 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}
footer .footerlink_area .ftr_logo {
	flex-basis: 85px;
	width: 100%;
}
footer .footerlink_area .ftr_linkpart {
	flex-basis: calc(100% - 85px);
	width: 100%;
	margin-left: auto;
	display: flex;
	justify-content: flex-end;
	flex-wrap: wrap;
}
footer .footerlink_area .ftr_linkpart .link_item {
	flex-basis: auto;
	margin-left: 60px;
}
footer .footerlink_area .ftr_linkpart .link_item h3 {
	font-weight: 700;
	margin-bottom: 16px;
	letter-spacing: -0.01em;
}
footer .footerlink_area .ftr_linkpart .link_item ul li {
	list-style-type: disc;
	margin-left: 20px;
	margin-bottom: 10px;
}
footer .footerlink_area .ftr_linkpart .link_item ul li a {
	font-size: 1.5rem;
	color: var(--texcolor01);
	text-decoration: underline;
	transition: 0.2s all ease 0s;
}
footer .footerlink_area .ftr_linkpart .link_item ul li a:hover {
	text-decoration: none;
}

footer .footerlink_area .ftr_linkpart .sns_link {
	flex-basis: 100%;
	margin-left: auto;
}
footer .footerlink_area .ftr_linkpart .sns_link ul {
	width: 100%;
	display: flex;
	justify-content: flex-end;
	gap: 10px;
}
footer .footerlink_area .ftr_linkpart .sns_link ul li.link_facebook a {
	display: inline-block;
	width: 54px;
	height: 54px;
	text-indent: -9999px;
	background: url("../images/common/mark_facebook.dfd97625af59.svg") no-repeat center center #fff;
	background-size: 30px;
	transition: 0.2s all ease 0s;
	border: 1px solid #fff;
}
footer .footerlink_area .ftr_linkpart .sns_link ul li.link_insta a {
	display: inline-block;
	width: 54px;
	height: 54px;
	text-indent: -9999px;
	background: url("../images/common/mark_insta.afac8448aec7.png") no-repeat center center #fff;
	background-size: 30px;
	transition: 0.2s all ease 0s;
	border: 1px solid #fff;
}
footer .footerlink_area .ftr_linkpart .sns_link ul li.link_youtube a {
	display: inline-block;
	width: 54px;
	height: 54px;
	text-indent: -9999px;
	background: url("../images/common/mark_youtube.6c49a9a3782f.svg") no-repeat center center #fff;
	background-size: 30px;
	transition: 0.2s all ease 0s;
	border: 1px solid #fff;
}

footer .footersublink_area {
	width: 100%;
	background-color: var(--texcolor02);
	padding: 14px 0;
}
footer .footersublink_area ul {
	display: flex;
	justify-content: center;
}
footer .footersublink_area ul li {
	padding: 0 10px;
	border-right: 1px solid #fff;
}
footer .footersublink_area ul li:first-child {
	border-left: 1px solid #fff;
}
footer .footersublink_area ul li a {
	color: #fff;
	font-size: 1.4rem;
	text-decoration: underline;
	font-weight: 400;
	transition: 0.2s all ease 0s;
}
footer .footersublink_area ul li a:hover {
	text-decoration: none;
}

footer .copyright_area {
	width: 100%;
	background-color: var(--bgcolor07);
	padding: 20px 0;
}
footer .copyright_area p {
	text-align: center;
	font-size: 1.2rem;
	color: #fff;
	line-height: 1;
	margin: 0 auto;
}


/* ==================
modal parts
===================== */
.modal-overlay {
	z-index:1000;
	display:none;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:rgba(0,0,0,0.8);
}

.modal-content {
	width: 700px;
	height: auto;
	max-height: 85vh;
	padding: 0 30px 30px 30px;
	top: 40%;
	position: fixed;
	display:none;
	z-index:1003;
	margin: 0;
	background-color: #fff;
	border-radius: 18px;
}

.modal-content h3 {
	font-size: 2rem;
	font-weight: 700;
	margin-bottom: 30px;
	border-left: 8px solid var(--texcolor02);
	padding-left: 12px;
	padding-top: 20px;
}
.modal-content p {
	font-size: 1.6rem;
}

.modal-close {
	position: absolute;
	vertical-align: middle;
	zoom: 1;
	top: 10px;
	right: 12px;
	width: 30px;
	height: 30px;
	cursor: pointer;
	z-index: 9999;
}
.modal-close:before,
.modal-close:after {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: 0;
	width: 30px;
	height: 3px;
	background-color: var(--texcolor02);
}
.modal-close:before {
	transform: rotate(45deg);
}
.modal-close:after {
	transform: rotate(-45deg);
}