@charset "UTF-8";

@media screen and (max-width: 1089px) {
	#mv { background:url("../img/common/mvBg.jpg") center center no-repeat; background-size: cover; width: 100%; height: 80vh;  position: relative; overflow: hidden; margin-bottom: 0vh; }
	#mv .mainCopy { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-55%); padding: 5vh 0; width: 80%; display: flex; flex-direction: column; justify-content: center; }
	#mv .mainCopy h2 { font-size: 1.5rem; color: var(--base-color); margin-bottom: 40px; font-weight: bold; line-height: 1.5; }
	#mv .mainCopy .keni { max-width: 600px; width: 96%; margin: 0 2%; }
	
	section { padding: 6%; }
	.img-loop { padding: 10vh 0 5vh !important; }
}
@media screen and (min-width: 600px) and (max-width: 889px) {
	section { padding: 4%; }
	.img-loop { padding: 10vh 0 5vh !important; }
	#mv .mainCopy { width: 70%; margin: 0 auto; }
	#mv .mainCopy h2 { font-size: 2.0rem; }
}
@media screen and (min-width: 900px) and (max-width: 1089px) {
	#mv .mainCopy { width: 70%; margin: 0 auto; }
	#mv .mainCopy h2 { font-size: 2.3rem; }
}
@media screen and (min-width: 1090px) {	
	#mv { background:url("../img/common/mvBg.jpg") center center no-repeat; background-size: cover; width: 100%; height: 80vh;  position: relative; overflow: hidden; margin-bottom: 5vh; }
	#mv .mainCopy { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); padding: 5vh 0; display: flex; flex-direction: column; justify-content: center; }
	#mv .mainCopy h2 { font-size: 2.8rem; color: var(--base-color); margin-bottom: 40px; font-weight: bold; line-height: 1.5; }
	#mv .mainCopy .keni { max-width: 700px; width: 100%; margin: 0 auto; }
	
	section .in { padding: 5vh 0; margin-bottom: 0; }
	.img-loop { padding: 10vh 0 5vh !important; }
}
@media screen and (min-width: 1090px) and (max-width: 1189px) {
	#mv .mainCopy { width: 60%; margin: 0 auto; }
	#mv .mainCopy h2 { font-size: 2.4rem; }
	#mv .mainCopy .keni { max-width: 620px; }
}
@media screen and (min-width: 1190px) and (max-width: 1289px) {
	#mv .mainCopy { width: 60%; margin: 0 auto; }
	#mv .mainCopy h2 { font-size: 2.5rem; }
	#mv .mainCopy .keni { max-width: 640px; }
}
@media screen and (min-width: 1290px) and (max-width: 1389px) {
	#mv .mainCopy { width: 55%; margin: 0 auto; }
	#mv .mainCopy h2 { font-size: 2.6rem; }
	#mv .mainCopy .keni { max-width: 660px; }
}
@media screen and (min-width: 1390px) and (max-width: 1489px) {
	#mv .mainCopy h2 { font-size: 2.7rem; }
	#mv .mainCopy .keni { max-width: 680px; }
}

#mv .swiper-vision { width: 100%; height: 100vh; position: absolute; top: 0; left: 0; }
#mv .video { min-width: 100%; min-height: 100vh; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 1; border: none; background: none; width: auto; }

/*画面サイズが変わっても常に動画の中央が表示されるようにする*/
/*動画よりも画面が横に長くなるとき用*/
@media (aspect-ratio: 16/9), (min-aspect-ratio: 16/9) {
  #mv .swiper-slide-mv .video { width: 100%; top: 50%; transform: translateY(-50%); }
}

/*動画よりも画面が縦に長くなるとき用*/
@media (max-aspect-ratio: 16/9) {
 #mv .swiper-slide-mv .video { height: 100%; left: 50%; transform: translateX(-50%); }
}
.ovry {
	position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0.7; z-index: 1;
	background-image: linear-gradient(45deg, rgba(0, 0, 0, .7) 50%, rgba(0, 0, 0, .9) 50%);
	background-size: 3px 3px;
}
.ovryBlue {
	position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0.7; z-index: 1;
	background-image: linear-gradient(45deg, rgb(0 69 113) 50%, rgb(0 23 39) 50%);
	background-size: 2px 2px;
}
/*-- コンテンツflex -------------------------------------------------------------*/
@media screen and (max-width: 889px) {
	.in-flex { display: flex; flex-direction: column; }
	.in-flex-Img { order: 1; height: 180px; }
	
	#anch01 .in-flex-Img { background: url("../img/common/scBg01.jpg") center center no-repeat; background-size: cover; }
	#anch01 .in-flex-Img.in-flex-Img01 { background: url("../img/common/scBg02.jpg") center center no-repeat; background-size: cover; }
	#anch02 .in-flex-Img { background: url("../img/common/scBg03.jpg") center center no-repeat; background-size: cover; }
	#anch02 .in-flex-Img.in-flex-Img02 { background: url("../img/common/scBg04.jpg") center center no-repeat; background-size: cover; }
	
	#anch03 .in-flex { display: flex; flex-direction: column; }
	#anch03 .in-flex-Img { /*background: #dceaf7; position: relative; border: 3px solid #b2d1e1;*/ order: 2; height: auto; }	
	#anch03 .in-flex-Txt { padding: 0vh 0% 0vh; background: #fff; z-index: 1; order: 1; }
	/*#anch03 .in-flex-Img .in-sec-copy { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-55%); z-index: 2; margin: 0 auto; }
	#anch03 .in-flex-Img .in-sec-copy .copyTtl { font-weight: bold; text-align: left;}
	#anch03 .in-flex-Img .in-sec-copy table { width: 100%; margin: 0 auto; }
	#anch03 .in-flex-Img .in-sec-copy table th { padding: 5px 20px 5px 0; word-break: keep-all; text-align: left; }
	#anch03 .in-flex-Img .in-sec-copy table td { padding: 5px 20px; word-break: keep-all; }
	#anch03 .in-flex-Img .map { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 1; width: 50%;  }*/
	
	.in-flex-Txt { order: 2; padding: 6% 4% 0; }
	.in-flex-Txt .ttl02 { text-align: left; margin-bottom: 10px; font-size: 1.3rem; line-height: 1.7; color: var(--sub-color); }
	.in-flex-Txt .ttl02 span.subTtl02 { font-size: 0.7em; color: #333;}
	.in-flex-Txt .grad-bar { margin-bottom: 20px;}
	.in-flex-Txt .ttl03 { margin-bottom: 10px; }
	.in-flex-Txt .ttl03 span { font-size: 0.9rem; border: 1px solid #999; padding: 2px 20px; color: #333; }
	.in-flex-Txt p { font-size: 0.85rem; }
	.in-flex-Txt p.txt { margin-bottom: 20px; }
}
@media screen and (min-width: 600px) and (max-width: 889px) {
	.in-flex-Img { height: 300px; }
	.in-flex-Txt .ttl02 { font-size: 1.8rem; }
	.in-flex-Txt .ttl03 span { font-size: 0.9rem; }
	.in-flex-Txt p { font-size: 0.9rem; }
	
	#anch03 .in-flex-Img .map { width: 40%;  }
}
@media screen and (min-width: 900px) {	
	.in-flex { display: flex; justify-content: space-between; align-items:center;  }
	.in-flex-mb { margin-bottom: 10vh; }
	.in-flex-Img { width: 42%; border-radius: 6px; }
	.in-flex-Txt { width: 52%; z-index: 1; padding: 2.5vh 0% 2.5vh; background: #fff; }
	.in-flex-Txt .ttl02 { text-align: left; margin-bottom: 20px; font-size: 2.0em; line-height: 1.4; color: var(--sub-color); }
	.in-flex-Txt .grad-bar { margin-bottom: 20px;}
	.in-flex-Txt p { margin-bottom: 0px;}
	
	#anch01 .in-flex-Img { background: url("../img/common/scBg01.jpg") center center no-repeat; background-size: cover; }
	#anch01 .in-flex-Img.in-flex-Img01 { background: url("../img/common/scBg02.jpg") center center no-repeat; background-size: cover; }
	#anch02 .in-flex-Img { background: url("../img/common/scBg03.jpg") center center no-repeat; background-size: cover; }
	#anch02 .in-flex-Img.in-flex-Img02 { background: url("../img/common/scBg04.jpg") center center no-repeat; background-size: cover; }
	
	#anch03 .in-flex { align-items: center; }
	#anch03 .in-flex-Img { width: 30%; display: flex; justify-content: center; align-items: center; }	
	#anch03 .in-flex-Txt { width: 64%; padding: 0vh 0% 0vh; background: #fff; z-index: 1; }
	/* #anch03 .in-flex-Img .in-sec-copy { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-55%); z-index: 2; margin: 0 auto; }
	#anch03 .in-flex-Img .in-sec-copy .copyTtl { font-weight: bold; text-align: left;}
	#anch03 .in-flex-Img .in-sec-copy table { width: 100%; margin: 0 auto; }
	#anch03 .in-flex-Img .in-sec-copy table th { padding: 5px 20px 5px 0; word-break: keep-all; text-align: left; }
	#anch03 .in-flex-Img .in-sec-copy table td { padding: 5px 20px; word-break: keep-all; }
	#anch03 .in-flex-Img .map { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 1; width: 60%;  }*/
	
	#anch04 .in-flex-L { width: 30%; }
	#anch04 .in-flex-Card { width: 66%; }
	
	.in-flex-Txt .box_link_btn_L:last-child { margin-bottom: 0px; }
}
@media screen and (min-width: 900px) and (max-width: 1089px) {
	.in-flex-Img { width: 46%; }
	.in-flex-Txt { width: 50%; }
	#anch03 .in-flex-Img { width: 40%; }
	#anch03 .in-flex-Txt { width: 56%; }
	.in-flex-Txt .ttl02 { font-size: 1.9em; }
	.in-flex-Txt .ttl03 span { font-size: 1.1em; }
}
@media screen and (min-width: 1090px) and (max-width: 1189px) {
}
@media screen and (min-width: 1190px) {
	.in-boxLink { display: flex; justify-content: flex-start; }
	.in-boxLink .box_link_btn_L { margin-right: 10px; margin-bottom: 0px; }
	.in-boxLink .box_link_btn_L:last-child { margin-right: 0px; }
}
@media screen and (min-width: 1190px) and (max-width: 1289px) {
}
@media screen and (min-width: 1290px) and (max-width: 1389px) {
}
@media screen and (min-width: 1390px) and (max-width: 1489px) {
}

/*-- 2つのポイント -------------------------------------------------------------*/
@media screen and (max-width: 599px) {
	.flexTwo li { margin-bottom: 20px; }
	.flexTwo li:last-child { margin-bottom: 0; }
	.flexTwo li .list-L { width: 30%; margin:0 auto 20px; }
	.flexTwo li .list-R p { font-size: 0.9rem; }
	.listTtl { font-weight: bold; margin-bottom: 10px; color:var(--base-color); font-size: 1.1rem; text-align: center;}
}
@media screen and (min-width: 600px) and (max-width: 1089px) {
	.flexTwo { margin-top: 40px; }
	.flexTwo li { margin-bottom: 20px; display: flex; justify-content: flex-start; }
	.flexTwo li:last-child { margin-bottom: 0; }
	
	.flexTwo li .list-L { width: 14%; margin-right: 6%; }
	.flexTwo li .list-R { width: 80%; }	
	
	.listTtl { font-weight: bold; margin-bottom: 10px; color:var(--base-color); font-size: 1.2rem;  }
}
@media screen and (min-width: 1090px) {
	.flexTwo { display: flex; justify-content: space-between; }	
	.flexTwo li { width: 50%; padding: 0 2%; border-right: 1px solid #dedede; display: flex; justify-content: flex-start; }
	.flexTwo li:last-child { border-right: none; }
	
	.flexTwo li .list-L { width: 18%; margin-right: 6%; }
	.flexTwo li .list-R { width: 76%; }	
	
	.listTtl { font-weight: bold; margin-bottom: 10px; color:var(--base-color); font-size: 1.2rem;  }
}
@media screen and (min-width: 1090px) and (max-width: 1189px) {
	.listTtl { font-size: 1.15rem; }
}
@media screen and (min-width: 1190px) and (max-width: 1289px) {
	.listTtl { font-size: 1.15rem; }
}
@media screen and (min-width: 1290px) and (max-width: 1389px) {
	.listTtl { font-size: 1.2rem; }
}

/*-- 会員テーブル -------------------------------------------------------------*/
@media screen and (max-width: 599px) {
	.memberTbl { max-width: 900px; margin: 0 auto; width: 100%; table-layout: fixed;}
	.memberTbl th { font-weight: bold; font-size: 1.2rem; padding: 20px 10px 10px; }
	.memberTbl th span { display: block; margin-top: 10px; }
	.memberTbl th span.takumi { background: #3e51de; padding: 5px 20px; border-radius: 50px; color: #fff; font-size: 0.9rem; }
	.memberTbl th span.suishin { background: #548961; padding: 5px 20px; border-radius: 50px; color: #fff; font-size: 0.9rem; }
	.memberTbl th span.ryutsu { background: #deba3e; padding: 5px 20px; border-radius: 50px; color: #fff; font-size: 0.9rem; }
	
	.memberTbl td { font-size: 3.6rem; font-family:'Roboto Condensed', sans-serif; font-weight:bold; text-align: center; line-height: 1.0; padding: 10px; }
	.memberTbl td .xsmall { font-size: 1.0rem;}
}
@media screen and (min-width: 600px) {
	.memberTbl { max-width: 900px; margin: 0 auto 40px; width: 100%; table-layout: fixed;}
	.memberTbl th { font-weight: bold; font-size: 1.2rem; padding: 0 10px; }
	.memberTbl th span { display: block; }
	.memberTbl th span.takumi { background: #3e51de; padding: 5px 20px; border-radius: 50px; color: #fff; font-size: 0.9rem; }
	.memberTbl th span.suishin { background: #548961; padding: 5px 20px; border-radius: 50px; color: #fff; font-size: 0.9rem; }
	.memberTbl th span.ryutsu { background: #deba3e; padding: 5px 20px; border-radius: 50px; color: #fff; font-size: 0.9rem; }
	
	.memberTbl td { font-size: 3.6rem; font-family:'Roboto Condensed', sans-serif; font-weight:bold; text-align: center; line-height: 1.0; padding: 10px; }
	.memberTbl td .xsmall { font-size: 1.0rem;}
}
@media screen and (min-width: 600px) and (max-width: 899px) {
	.memberTbl td { font-size: 3.1rem; }
}
@media screen and (min-width: 900px) and (max-width: 1089px) {
	.memberTbl td { font-size: 3.2rem; }
}
@media screen and (min-width: 1090px) and (max-width: 1189px) {
	.memberTbl td { font-size: 3.3rem; }
}
@media screen and (min-width: 1190px) and (max-width: 1289px) {
	.memberTbl td { font-size: 3.4rem; }
}
@media screen and (min-width: 1290px) and (max-width: 1389px) {
	.memberTbl td { font-size: 3.5rem; }
}

/*-- フォーム -------------------------------------------------------------*/
@media screen and (max-width: 599px) {
	.out-formFlex { margin: 0 auto; width: 100%; background: #fff; padding: 20px 10px; border: 1px solid #dedede; border-radius: 6px;}
	.formFlex { display: flex; flex-direction: column; justify-content: center; align-items: center; }
	.formFlex .in-formFlex { margin: 0 4% 20px; }
	.formFlex .in-formFlex select { padding: 5px 10px; border: 1px solid #dedede; }
	.formFlex .in-formFlex p { text-align: center; font-weight: bold; margin-bottom: 5px; }
	.formFlex .in-formFlex input[type=text] { padding: 5px 10px; border: 1px solid #dedede; }
	.flatbtn { margin-bottom: 0px; }
	.flatbtn a { width: 200px; margin: 0 auto; height: 35px; line-height: 35px; color: #fff; border: #ffa23e 1px solid; display: block; text-align: center; background: #ffa23e; border-bottom: #e68822 3px solid; border-radius: 4px; }
	.flatbtn a:hover { color:#ffa23e; background:#fff; text-decoration:none; }
}
@media screen and (min-width: 600px) {
	.out-formFlex { max-width: 900px; margin: 0 auto; width: 100%; background: #fff; padding: 20px 10px; border: 1px solid #dedede; border-radius: 6px;}
	.formFlex { display: flex; justify-content: center; align-items: center; }
	.formFlex .in-formFlex { margin: 0 4% 20px; }
	.formFlex .in-formFlex select { padding: 5px 10px; border: 1px solid #dedede; }
	.formFlex .in-formFlex p { text-align: center; font-weight: bold; margin-bottom: 5px; }
	.formFlex .in-formFlex input[type=text] { padding: 5px 10px; border: 1px solid #dedede; }
	.flatbtn { margin-bottom: 0px; }
	.flatbtn a { width: 200px; margin: 0 auto; height: 35px; line-height: 35px; color: #fff; border: #ffa23e 1px solid; display: block; text-align: center; background: #ffa23e; border-bottom: #e68822 3px solid; border-radius: 4px; }
	.flatbtn a:hover { color:#ffa23e; background:#fff; text-decoration:none; }
}
@media screen and (min-width: 600px) and (max-width: 899px) {
}
@media screen and (min-width: 900px) and (max-width: 1089px) {
}
@media screen and (min-width: 1090px) and (max-width: 1189px) {
}
@media screen and (min-width: 1190px) and (max-width: 1289px) {
}
@media screen and (min-width: 1290px) and (max-width: 1389px) {
}

/*-- ニュース タブ -------------------------------------------------------------*/
@media screen and (max-width: 599px) {
	.tabs { border-bottom: 1px solid var(--base-color); display: flex; justify-content: center; margin: 40px auto; max-width: 960px; width: 100%; }
	.tabs li { height: 35px; line-height: 35px; width: 100px; text-align: center; border-top: 1px solid var(--base-color); border-right: 1px solid var(--base-color); border-left: 1px solid var(--base-color); margin: 0 5px; font-size: 0.9rem; position: relative;}
	.tabs li.selected { background: var(--base-color); }
	.tabs li.selected:after { position: absolute; bottom: -1px; left: 0; content: ""; width: 100px; height: 1px; background: var(--base-color); z-index: 1; }
	.tabs li a { display: block; }
	.tabs li a:link    { color:var(--base-color); text-decoration: none; }
	.tabs li a:visited { color:var(--base-color); text-decoration: none; }
	.tabs li a:hover   { color:#fff; text-decoration: none; background: var(--base-color); }
	.tabs li a:active  { color:var(--base-color); text-decoration: none; }
	
	.tabs li.selected a:link    { color:#fff; text-decoration: none; }
	.tabs li.selected a:visited { color:#fff; text-decoration: none; }
	.tabs li.selected a:hover   { color:#fff; text-decoration: none; opacity: 0.7; }
	.tabs li.selected a:active  { color:#fff; text-decoration: none; }
	
	.top-works { background: #f4f4f4; padding: 40px 0; }
	
	.newsList { max-width: 1020px; width: 100%; margin: 0 auto 40px; }
	.newsList li { display: flex; justify-content: flex-start; align-items: center; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px dotted #dedede; }
	.newsList li .newsDl { margin-right: 10px; }
	.newsDl { display: flex; justify-content: flex-start; align-items: center; margin-bottom: 20px; }
	.newsDl dt { background: var(--base-color); color: #fff; font-size: 10px; height: 20px; line-height: 20px; padding: 0 10px; border: 1px solid var(--base-color); font-family:'Roboto Condensed', sans-serif; font-weight:bold; }
	.newsDl dd { background: #fff; color: var(--base-color); font-size: 10px; height: 20px; line-height: 20px; padding: 0 10px; border: 1px solid var(--base-color); font-family:'Roboto Condensed', sans-serif; font-weight:bold; }
	.newsList li p { margin-bottom: 0px; }
}
@media screen and (min-width: 600px) {
	
	.tabs { border-bottom: 1px solid var(--base-color); display: flex; justify-content: center; margin: 40px auto; max-width: 960px; width: 100%; }
	.tabs li { height: 35px; line-height: 35px; width: 100px; text-align: center; border-top: 1px solid var(--base-color); border-right: 1px solid var(--base-color); border-left: 1px solid var(--base-color); margin: 0 5px; font-size: 0.9rem; position: relative;}
	.tabs li.selected { background: #fff; }
	.tabs li.selected:after { position: absolute; bottom: -1px; left: 0; content: ""; width: 100px; height: 1px; background: #fff; z-index: 1; }
	.tabs li a { display: block; }
	.tabs li a:link    { color:var(--base-color); text-decoration: none; }
	.tabs li a:visited { color:var(--base-color); text-decoration: none; }
	.tabs li a:hover   { color:#fff; text-decoration: none; background: var(--base-color); }
	.tabs li a:active  { color:var(--base-color); text-decoration: none; }
	
	.tabs li.selected a:link    { color:var(--base-color); text-decoration: none; }
	.tabs li.selected a:visited { color:var(--base-color); text-decoration: none; }
	.tabs li.selected a:hover   { color:#fff; text-decoration: none; background: var(--base-color); }
	.tabs li.selected a:active  { color:var(--base-color); text-decoration: none; }
	
	.top-works { background: #f4f4f4; padding: 40px 0; }
	
	.newsList { max-width: 960px; width: 100%; margin: 0 auto 40px; }
	.newsList li { display: flex; justify-content: flex-start; align-items: center; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px dotted #dedede; }
	.newsList li .newsDl { margin-right: 10px; }
	.newsDl { display: flex; justify-content: flex-start; align-items: center; }
	.newsDl dt { background: var(--base-color); color: #fff; font-size: 12px; height: 20px; line-height: 20px; padding: 0 10px; border: 1px solid var(--base-color); font-family:'Roboto Condensed', sans-serif; font-weight:bold; }
	.newsDl dd { background: #fff; color: var(--base-color); font-size: 12px; height: 20px; line-height: 20px; padding: 0 10px; border: 1px solid var(--base-color); font-family:'Roboto Condensed', sans-serif; font-weight:bold; }
	.newsList li p { margin-bottom: 0px; }
	
}
@media screen and (min-width: 600px) and (max-width: 899px) {
	.tabs li { height: 30px; line-height: 30px; padding: 0 20px; font-size: 0.8rem; }
}
@media screen and (min-width: 900px) and (max-width: 1089px) {
	.tabs li { height: 35px; line-height: 35px; padding: 0 20px; font-size: 0.85rem; }
}
@media screen and (min-width: 1090px) and (max-width: 1189px) {
	.tabs li { height: 35px; line-height: 35px; padding: 0 30px; font-size: 0.85rem; }
}
@media screen and (min-width: 1190px) and (max-width: 1289px) {
	.tabs li { padding: 0 30px; font-size: 0.85rem; }
}
@media screen and (min-width: 1290px) and (max-width: 1389px) {
}

/*-- バナーリスト -------------------------------------------------------------*/
@media screen and (max-width: 599px) {
}
@media screen and (min-width: 600px) {
	.top_ex_list { display: flex; justify-content: center; flex-wrap: wrap; }
	.top_ex_list li { width: 18%; margin: 0 1% 20px; }
	.top_ex_list li div { text-align: center; margin-bottom: 10px; }
	.top_ex_list li .high_ttl { color:var(--base-color); margin-bottom: 10px; font-weight: bold; text-align: left; }
	.top_ex_list li p { text-align: left; font-size: 0.9rem; }
}
@media screen and (min-width: 600px) and (max-width: 899px) {
	.top_ex_list li { width: 48%; }
}
@media screen and (min-width: 900px) and (max-width: 1089px) {
	.top_ex_list li { width: 31%; }
}
@media screen and (min-width: 1090px) and (max-width: 1189px) {
	.top_ex_list li { width: 23%; }
}
@media screen and (min-width: 1190px) and (max-width: 1289px) {
	.top_ex_list li { width: 23%; }
}
@media screen and (min-width: 1290px) and (max-width: 1389px) {
	.top_ex_list li { width: 23%; }
}

/*-- フォーム -------------------------------------------------------------*/
@media screen and (max-width: 599px) {
	.contactList { }
	.contactList li { width: 90%; margin: 0 auto 10px;height: 50px; line-height: 50px; background: var(--base-color); border: 1px solid var(--base-color); text-align: center; position: relative; border-radius: 8px; font-size: 0.9rem;}
	.contactList li:after { content: "〉"; font-family: "Font Awesome 5 Free"; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); color: #fff; opacity: 0.5; }
	.contactList li a         { resize: none; display: block; }
	.contactList li a:link    { color:#fff; text-decoration: none; }
	.contactList li a:visited { color:#fff; text-decoration: none; }
	.contactList li a:hover   { color:var(--base-color); text-decoration: none; background: #fff; border-radius: 8px; }
	.contactList li a:active  { color:#fff; text-decoration: none; }
	
	.contactList li.ogBtn { background:var(--sub-color); border: 1px solid var(--sub-color); }
	.contactList li.ogBtn { color: var(--sub-color); }
	.contactList li.ogBtn:hover:after { color:var(--sub-color); }
	.contactList li.blueBtn { background:#0084ff; border: 1px solid #0084ff; }
	.contactList li.blueBtn a:hover { color: #0084ff; }
	.contactList li.blueBtn:hover:after { color:#0084ff; }
}
@media screen and (min-width: 600px) {
	.contactList { display: flex; justify-content: space-between; align-items: center; max-width: 1000px; margin: 0 auto; }
	.contactList li { width: 48%; height: 80px; line-height: 80px; background: var(--base-color); border: 1px solid var(--base-color); text-align: center; position: relative; border-radius: 8px; font-size: 1.1rem; font-weight: bold; }
	.contactList li:after { content: "〉"; font-family: "Font Awesome 5 Free"; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); color: #fff; opacity: 0.5; }
	.contactList li a         { resize: none; display: block; }
	.contactList li a:link    { color:#fff; text-decoration: none; }
	.contactList li a:visited { color:#fff; text-decoration: none; }
	.contactList li a:hover   { color:var(--base-color); text-decoration: none; background: #fff; border-radius: 8px; }
	.contactList li a:active  { color:#fff; text-decoration: none; }
	
	.contactList li.ogBtn { background:var(--sub-color); border: 1px solid var(--sub-color); }
	.contactList li.ogBtn { color: var(--sub-color); }
	.contactList li.ogBtn:hover:after { color:var(--sub-color); }
	.contactList li.blueBtn { background:#0084ff; border: 1px solid #0084ff; }
	.contactList li.blueBtn a:hover { color: #0084ff; }
	.contactList li.blueBtn:hover:after { color:#0084ff; }
}
@media screen and (min-width: 600px) and (max-width: 899px) {
	.contactList li { font-size: 1.0rem; height: 70px; line-height: 70px; }
}
@media screen and (min-width: 900px) and (max-width: 1089px) {
	.contactList li { font-size: 1.05rem; height: 75px; line-height: 75px; }
}
@media screen and (min-width: 1090px) and (max-width: 1189px) {
}
@media screen and (min-width: 1190px) and (max-width: 1289px) {
}
@media screen and (min-width: 1290px) and (max-width: 1389px) {
}

/*-- 動画 -------------------------------------------------------------*/
@media screen and (max-width: 599px) {
	.in-movie { position: relative; }
	.movie_icon { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
}
@media screen and (min-width: 600px) {
	.in-movie { position: relative; }
	.movie_icon { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
}
@media screen and (min-width: 600px) and (max-width: 899px) {
}
@media screen and (min-width: 900px) and (max-width: 1089px) {
}
@media screen and (min-width: 1090px) and (max-width: 1189px) {
}
@media screen and (min-width: 1190px) and (max-width: 1289px) {
}
@media screen and (min-width: 1290px) and (max-width: 1389px) {
}

/*-- ボタン -------------------------------------------------------------*/
@media screen and (max-width: 599px) {
	.topicsBtn { display: flex; justify-content: center; flex-wrap: wrap; }
	.topicsBtn li { height: 60px; line-height: 60px; text-align: center; background: #f4f4f4; border: 3px solid #dedede; color: #fff; font-size: 0.8rem; width: 46%; margin: 0 1% 20px; }
	
	.topicsBtn li a         { resize: none; display: block; }
	.topicsBtn li a:link    { color:#ccc; text-decoration: none; }
	.topicsBtn li a:visited { color:#ccc; text-decoration: none; }
	.topicsBtn li a:hover   { color:#ccc; text-decoration: none; opacity: 0.7; }
	.topicsBtn li a:active  { color:#ccc; text-decoration: none; }
	
	.snsList { }
	.snsList li { margin-bottom: 20px;  }
	.snsList li .snsIcon { width: 40px; margin: 0 auto 10px; }
	.snsList li .snsDiv { width: 100%; max-height: 300px; height: 300px; background: #f4f4f4; position: relative; }
	.snsList li .snsDiv p { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-size: 0.8rem; color: #ccc; }
}
@media screen and (min-width: 600px) {
	.topicsBtn { display: flex; justify-content: flex-start; flex-wrap: wrap; }
	.topicsBtn li { height: 100px; line-height: 100px; text-align: center; background: #f4f4f4; border: 3px solid #dedede; color: #fff; font-size: 0.8rem; width: 17.5%; margin: 0 1% 20px; }
	
	.topicsBtn li a         { resize: none; display: block; }
	.topicsBtn li a:link    { color:#ccc; text-decoration: none; }
	.topicsBtn li a:visited { color:#ccc; text-decoration: none; }
	.topicsBtn li a:hover   { color:#ccc; text-decoration: none; opacity: 0.7; }
	.topicsBtn li a:active  { color:#ccc; text-decoration: none; }
	
	.snsList { display: flex; justify-content: space-between; }
	.snsList li { width: 30%; }
	.snsList li .snsIcon { width: 40px; margin: 0 auto 10px; }
	.snsList li .snsDiv { width: 100%; max-height: 300px; height: 300px; background: #f4f4f4; position: relative; }
	.snsList li .snsDiv p { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-size: 0.8rem; color: #ccc; }
}
@media screen and (min-width: 600px) and (max-width: 899px) {
	.topicsBtn li { width: 30.0%; }
}
@media screen and (min-width: 900px) and (max-width: 1089px) {
	.topicsBtn li { width: 21.4%; }
}
@media screen and (min-width: 1090px) and (max-width: 1189px) {
	.topicsBtn li { width: 22.4%; }
}
@media screen and (min-width: 1190px) and (max-width: 1289px) {
	.topicsBtn li { width: 22.4%; }
}
@media screen and (min-width: 1290px) and (max-width: 1389px) {
}


/*-- フォーム -------------------------------------------------------------*/
@media screen and (max-width: 599px) {
}
@media screen and (min-width: 600px) {
}
@media screen and (min-width: 600px) and (max-width: 899px) {
}
@media screen and (min-width: 900px) and (max-width: 1089px) {
}
@media screen and (min-width: 1090px) and (max-width: 1189px) {
}
@media screen and (min-width: 1190px) and (max-width: 1289px) {
}
@media screen and (min-width: 1290px) and (max-width: 1389px) {
}