@charset "utf-8";
@media screen and (max-width: 767px) {
/*CONTENTS*/
#contact {
}
.contact-list {
	color:rgba(255,255,255,1);
	position:relative;
	border-top:solid 4px #6f369e;
}
.contact-list::before{
  display:block;
  content:'';
  width:100%;
  height:100%;
  position:absolute;
  top:0;
  background-color:rgba(48,69,197,1);
  mix-blend-mode:soft-light;
}
.contact-list .container {
	padding:40px 20px;
}
.contact-list p.title {
	text-align:center;
	margin-bottom:1rem;
}
.contact-list p.comment {
	font-size:12px;
}
.contact-list .nav-contact {
	position:relative;
	z-index:1;
}
.contact-list ul.nav-contact li {
	display:flex;
	flex-flow:row wrap;
	justify-content:flex-start;
	align-items:center;
	margin-bottom:.5rem;
}
.contact-list li.tel {
	background-color:rgba(255,255,255,1);
	text-align:left;
	padding:0;
}
.contact-list li.tel img {
	width:100%;
	max-width:320px;
}
.contact-list ul.nav-contact li a {
	display:flex;
	flex-flow:row wrap;
	justify-content:space-between;
	align-items:center;
	color:#FFF;
	width:100%;
	height:100%;
	padding:10px;
	opacity:1;
	transition:opacity ease .5s;
}
.contact-list ul.nav-contact li a .icon {
	width:48px;
}
.contact-list ul.nav-contact li a p.comment {
	width:calc(100% - 60px);
	line-height:1.2;
}
.contact-list ul.nav-contact li.tel a {
	display:block;
	padding:10px 0 10px 0;
}
.contact-list ul.nav-contact li.line a {
	background-color:#06C755;
}
.contact-list ul.nav-contact li.mail a {
	background-color:rgba(84,143,242,1);
}
.contact-list ul.nav-contact li.comment {
	display:block;
	text-align:center;
	padding:1.5rem 0 0;
	margin-bottom:0;
}

/*メール*/
#contact_mail {
	background-color:rgba(244,244,244,1);
	padding:40px 20px;
}
#contact #form_mail .ftr .fth {
	color:rgba(255,255,255,1);
}
#contact #form_mail .ftr .ftd {
}
}
@media screen and (min-width: 768px) {
/*HEADER NAVI*/
#header .container ul.pc li.contact a {
	color:rgba(255,255,255,1);
	background-color:rgba(0,117,143,1);
}
#header .container ul.pc li.contact a .ja,
#header .container ul.pc li.contact a .en {
	color:rgba(255,255,255,1);
}
/*CONTENTS*/
#contact {
}
.contact-list {
	color:rgba(255,255,255,1);
	position:relative;
	border-top:solid 4px #6f369e;
}
.contact-list::before{
  display:block;
  content:'';
  width:100%;
  height:100%;
  position:absolute;
  top:0;
  background-color:rgba(48,69,197,1);
  mix-blend-mode:soft-light;
}
/*メール*/
#contact_mail {
	background-color:rgba(244,244,244,1);
	padding:60px 0;
}
#contact_mail .container {
	width:960px;
	padding:0;
	margin:auto;
}
}