@charset "UTF-8";
/* CSS Document */

*{ font-family: 'Noto Sans', 'Arial', 'Helvetica Neue', sans-serif; }
*, *:before, *:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;  /* paddingやborderに依存しないwidth,height指定 */
}
html { font-size: 62.5%; -webkit-text-size-adjust: 100%; } /* スマホで勝手に文字が大きくなるのを制御　-webkit-text-size-adjust:100% */

body {
color: #333;
background: #fff;
line-height: 1.65em;
letter-spacing: 0em;
font-size: 1.5rem;
font-weight: 400;
margin: 0px;
padding: 0px;
}
@media screen and (max-width: 768px) {
  body { 
  font-size: 1.4rem;
  margin-top: 46px;
  }
}

/* パソコンで見たときは"pc"のclassがついた方が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
.br-pc { display: none; }
.br-sp { display: block; }
/* スマートフォンで見たときは"sp"のclassがついた方が表示される */
@media screen and (max-width: 767px) {
.pc { display: none !important; }
.sp { display: block !important; }
.br-pc { display: block; }
.br-sp { display: none; }
}
/* パソコンで見たときは"pc"のclassがついた方が表示される ヘッダー */
.head_pc { display: block !important; }
.head_sp { display: none !important; }
/* スマートフォンで見たときは"sp"のclassがついた方が表示される ヘッダー */
@media screen and (max-width: 1255px) {
.head_pc { display: none !important; }
.head_sp { display: block !important; }
}
/* 	ふわっと切り替え */
a {
text-decoration: none;
color: #333;
transition: 0.5s;
}
a:hover {
text-decoration: none;
color: #e22b48;
}

/* ================================================
 
 sp header
 
================================================ */

ul.header_sp {
position: fixed;
top: 0;
bottom: auto;
display: flex;
justify-content: space-between;
width: 100%;
height: 46px;
z-index: 3;
padding: 0px;
background: #fff;
}
ul.header_sp.change-shadow {
box-shadow: 0 0 5px darkgrey;
}
ul.header_sp li.logo {
display: flex;
justify-content: center;
align-items: center;
position: relative;
cursor: pointer;
text-align: center;
font-weight: 900;
line-height: 50px;
width: 45%;
padding-left: 15px;
overflow: hidden;
}
ul.header_sp li.logo img {
width: 100%;
display: block;
margin: 0 auto;
}
ul.header_sp li.sign,
ul.header_sp li.mypage,
ul.header_sp li.search {
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
width: 15%;
height: 90%;
margin-top: 3px;
padding: 0px 5px;
}
ul.header_sp li.search {
height: 100%;
margin-top: 0px;
padding: 0px 8px;
background: #e22b48;
}
ul.header_sp li.sign span.icon,
ul.header_sp li.mypage span.icon,
ul.header_sp li.search span.icon {
text-align: center;
width: 100%;
display: block;
line-height: 1;
}
ul.header_sp li.search span.icon {
color: #fff;
}
ul.header_sp li.sign span.icon_fas,
ul.header_sp li.mypage span.icon_fas,
ul.header_sp li.search span.icon_fas {
display: inline-block;
font-style: normal;
font-variant: normal;
text-rendering: auto;
line-height: 1;
margin-top: -2px;
}
ul.header_sp li.sign span.icon_fas:before {
content: url("../images/sign_in_sp_icon.png");
line-height: 1;
}
ul.header_sp li.mypage span.icon_fas:before {
content: url("../images/mypage_sp_icon.png");
line-height: 1;
}
ul.header_sp li.search span.icon_fas:before {
content: "\f002";
font-family: "Font Awesome 5 Free";
font-weight: 900;
font-size: 1.8rem;
line-height: 1;
}
ul.header_sp li.sign span.sear_caption,
ul.header_sp li.mypage span.sear_caption,
ul.header_sp li.search span.sear_caption {
display: block;
font-size: 1.0rem;
text-align: center;
color: #e22b48;
line-height: 1;
}
ul.header_sp li.mypage span.sear_caption {
margin-top: -2px;
}
ul.header_sp li.search span.sear_caption {
padding-top: 3px;
color: #fff;
}

/* menu dropdown */

ul.header_sp li.menu {
width: 17%;
margin-left: 8%;
}
.drawer_button {
color: #e22b48;
/* ハンバーガーメニュー文字色 */
display: none;
}
.drawer_button {
display: block;
color: #e22b48;
border: none;
width: 100%;
cursor: pointer;
text-align: center;
outline: none;
letter-spacing: 0.02em;
}
.drawer_bar {
display: block;
height: 3px;
margin: 3px auto;
transition: all 0.2s;
transform-origin: 0 0;
width: 16px;
border-radius: 6px;
background-color: #e22b48;
}
.drawer_text {
text-align: center;
font-size: 1.0rem;
	}
.drawer_close {
letter-spacing: 0.08em;
display: none;
}
.drawer_menu_text {
display: block;
}
/* active */
.drawer_button.active .drawer_bar {
width: 15px;
}
.drawer_button.active .drawer_bar1 {
transform: rotate(45deg) translateX(2px) translateY(0px);
}
.drawer_button.active .drawer_bar2 {
opacity: 0;
}
.drawer_button.active .drawer_bar3 {
transform: rotate(-45deg);
}
.drawer_button.active .drawer_menu_text {
display: none;
}
.drawer_button.active .drawer_close {
display: block;
}
.drawer_menu .drawer_bg {
width: 100%;
height: 100%;
position: fixed;
z-index: 999;
background-color: rgba(51, 51, 51, 0.5);
display: none;
top: 46px;
left: 0;
}
.drawer_nav_wrapper {
width: 80%;
height: 100%;
transition: all 0.4s;
transform: translate(800px);
position: fixed;
top: 46px;
right: 0;
z-index: 1000;
background-color: #fff;
overflow-x: hidden;
overflow-y: auto;
}
.drawer_menu .drawer_nav {
display: block;
position: relative;
}
.drawer_menu .drawer_nav li {
background-color: #fff;
height: auto;
line-height: 50px;
/*  ドロワーメニューリスト項目高さ */
position: relative;
border-bottom: 1px solid #eee;
}
.drawer_menu .drawer_nav li.title {
margin: 7px auto 5px;
padding: 15px 0px;
width: 90%;
height: auto;
font-size: 1.5rem;
color: #fff;
text-align: center;
background: #e22b48;
border-radius: 4px;
letter-spacing: 0.15em;
line-height: 0;
}
.drawer_menu .drawer_nav li a {
display: flex;
align-items: center;
padding: 12px 50px 12px 20px;
font-size: 1.4rem;
font-weight: 700;
color: #555;
text-align: left;
line-height: 140%;
min-height: 50px;
}
/* スマートフォン2階層目 */
.drawer_menu .drawer_nav li:hover ul.second-level {
display: none;
}
.drawer_menu .drawer_nav li ul.second-level {
display: none;
position: relative;
padding: 0;
z-index: 1001;
}
.drawer_menu .drawer_nav li ul.second-level li a {
padding-left: 40px;
}
.drawer_menu .drawer_nav_wrapper.open {
transform: translate(0);
}
.drawer_menu.left .drawer_button {
right: auto;
left: 32px;
}
.drawer_menu.left .drawer_nav_wrapper {
transform: translate(-250px);
right: auto;
left: 0;
}
.drawer_menu.left .drawer_nav_wrapper.open {
transform: translate(0);
}
.touch-btn {
color: #555;
position: absolute;
top: 0;
right: 0;
display: block;
z-index: 10;
width: 50px;
height: 50px;
text-align: center;
vertical-align: middle;
}
.touch-btn span.touch_arrow {
color: #555;
position: absolute;
top: 43%;
right: 40%;
display: block;
z-index: 10;
width: 10px;
height: 10px;
text-align: center;
vertical-align: middle;
border-right: 2px solid #333;
border-bottom: 2px solid #333;
transform: rotate(45deg);
}

/* ================================================
 
 pc header
 
================================================ */

.header_in {
display: flex;
width: 1256px;
margin: 0 auto;
border-bottom: 1px solid #E6E7EB;
}
.logo_image {
display: flex;
align-items: center;
width: 16%;
}
.logo_image a {
display: flex;
align-items: center;
height: 21px;
}
.logo_image img {
width: auto;
height: 100%;
}
.head_search {
margin-right: 10px;
width: 66%;
}
.search_box {
position: relative;
margin: 1em 0em 1em 0em;
}
.search_box input {
padding: 7px 7px 7px 15px;
width: 100%;
font-size: 1.5rem;
border-radius: 1200px;
border: 2px solid #e22b48;
background: #fff;
}
.bn_wrp {
position: absolute;
top: 0px;
right: 0px;
width: 33%;
max-width: 130px;
height: 100%;
padding-right: 10px;
display: inline-block;
background: #e22b48;
border-top-right-radius: 1200px;
border-bottom-right-radius: 1200px;
}
.search_submit {
position: absolute;
top: calc(50% - 12px);
right: 3px;
font-size: 1.7rem;
cursor: pointer;
border: none;
color: #ddd;
padding: 0 24px 0px 0px;
background-color: rgba(255, 255, 255, 0);
}
span.fa_search {
cursor: pointer;
color: #ddd;
}
span.fa_search:before {
content: "\f002";
font-family: "Font Awesome 5 Free";
font-weight: 900;
color: #ddd;
font-size: 1.8rem;
line-height: 1;
}
.h_searchttl {
font-size: 1.7rem;
font-weight: 700;
}
.head_favo {
width: 5.3%;
display: flex;
align-items: center;
justify-content: center;
}
.head_favo.follow {
width: 6%;
}
.head_favo a {
display: block;
color: #e22b48;
text-decoration: none;
}
.head_favo span.icon {
text-align: center;
width: 100%;
display: block;
line-height: 1;
}
.head_favo span.icon_fas {
display: inline-block;
font-style: normal;
font-variant: normal;
text-rendering: auto;
line-height: 1;
}
.head_favo span.icon_fas.pick {
margin-top: 1px;
}
.head_favo span.icon_fas:before {
content: url("../images/sign_in_icon.png");
line-height: 1;
height: 23px;
}
.head_favo span.icon_fas.pick:before {
content: url("../images/mypage_icon.png");
}
.head_favo a:hover span.icon_fas {
content: url("../images/sign_in_hover_icon.png");
}
.head_favo a:hover span.icon_fas.pick {
content: url("../images/mypage_icon_hover.png");
}
.head_favo.follow span.icon_fas,
.head_favo.favorite02 span.icon_fas {
margin-top: 3px;
}
.head_favo.follow span.icon_fas:before {
content: url("../images/follow_list_icon.png");
height: 22px;
}
.head_favo.follow a:hover span.icon_fas {
content: url("../images/folow_list_hover_icon.png");
}
.head_favo span.favo_caption {
display: block;
padding-top: 3px;
font-size: 1.25rem;
font-weight: 700;
text-align: center;
line-height: 1;
}
.head_favo span.favo_caption.pick {
margin-top: -2px;
padding-top: 0px;
}
.head_favo.favorite02 span.icon_fas:before {
content: url("../images/heart_icon.png");
line-height: 1;
height: 20px;
}
.head_favo.favorite02 a:hover span.icon_fas {
content: url("../images/heart_hover_icon.png");
}
.head_favo.favorite02 span.favo_caption {
padding-top: 5px;
}
nav.navi {
box-shadow: 0px 2px 10px -12px;
}
.navi_in {
width: 1256px;
margin: 0 auto;
}
.navi-in a {
color: #333;
text-decoration: none;
display: block;
transition: all 0.3s ease-in-out;
}
.navi-in a:hover {
background-color: #f5f8fa;
transition: all 0.3s ease-in-out;
color: #e22b48;
}
/* チェックボックスを非表示 */
nav.navi input {
display: none;
}
.menu {
display: flex;
align-items: center;
justify-content: space-between;
position: relative;
width: 92%;
margin: 0 auto;
}
.menu li a {
position: relative;
display: block;
padding: 7px 0px;
font-size: 1.35rem;
color: #333;
}
/* 下矢印 */
a.init-bottom:after {
content: '';
position: absolute;
top: 39%;
right: -15px;
width: 7px;
height: 7px;
border-right: 2px solid #999;
border-bottom: 2px solid #999;
transform: rotate(45deg);
}
a.init-bottom:hover:after {
border-right: 2px solid #e22b48;
border-bottom: 2px solid #e22b48;
}
.menu > li {
margin: 0 15px;
font-size: 1.35rem;
}
.menu > li a:hover {
color: #e22b48;
}
.menu > li:hover > ul > li,
.menu li ul li:hover > ul > li {
display: block;
align-items: flex-start;
width: 300px;
padding: 6px 30px 6px 20px;
line-height: 140%;
border-bottom: 1px dotted #ccc;
}
.menu > li:hover > ul > li a,
.menu li ul li:hover > ul > li a {
text-align: left;
font-size: 1.35rem;
border-right: none;
}
.menu-navibtn {
display: none;
cursor: pointer;
cursor: hand;
}
/* ドロップダウンメニュー */
.menu li ul {
position: absolute;
box-shadow: 0px 5px 11px -8px;
z-index: 200;
}
/* 子メニュー */
.menu > li > ul li {
position: relative;
font-size: 1.35rem;
display: none;
padding: 0px 20px;
background-color: #FFF;
}
.menu > li > ul li:hover {
font-weight: 600;
background: #fff0f0;
}
.menu li ul li:last-child,
.menu li ul li ul li:last-child {
border-bottom: none;
}
/* 右矢印 */
.menu > li > ul li:after {
content: '';
position: absolute;
top: 43%;
right: 13px;
width: 7px;
height: 7px;
margin: 0 0 0 15px;
border-right: 2px solid #ccc;
border-top: 2px solid #ccc;
transform: rotate(45deg);
}
.menu > li > ul li:hover:after {
border-right: 2px solid #e22b48;
border-top: 2px solid #e22b48;
}
.menu li ul li ul {
top: 0px;
left: 100%;
}
.menu > li > ul {
margin-top: 1px;
margin-left: -40px;
width: auto;
}

/* ================================================
 
 sp footer
 
================================================ */

ul.menu_sp_footer {
display: flex;
background: #fff;
box-shadow: 0 0 5px darkgrey;
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 2;
padding: 0;
margin: 0;
list-style: none;
line-height: 1.4;
min-height: 50px;
transition: .3s;
}
ul.menu_sp_footer li {
position: relative;
width: 100%;
padding-top: 3px;
cursor: pointer;
}
ul.menu_sp_footer li a {
display: block;
color: #e22b48;
}
ul.menu_sp_footer .menu_icon {
display: block;
width: 100%;
padding-top: 5px;
text-align: center;
line-height: 120% !important;
}
ul.menu_sp_footer .menu_icon.favorite02 {
padding-top: 6px;
}
ul.menu_sp_footer .home_icon,
ul.menu_sp_footer .search_icon,
ul.menu_sp_footer .favo_icon,
ul.menu_sp_footer .top_icon,
ul.menu_sp_footer .how_icon,
ul.menu_sp_footer .favorite_icon,
ul.menu_sp_footer .follow_icon {
display: inline-block;
font-style: normal;
font-variant: normal;
text-rendering: auto;
line-height: 1;
}
ul.menu_sp_footer .home_icon:before,
ul.menu_sp_footer .search_icon:before,
ul.menu_sp_footer .favo_icon:before,
ul.menu_sp_footer .top_icon:before,
ul.menu_sp_footer .how_icon:before {
content: "\f015";
font-family: "Font Awesome 5 Free";
font-weight: 900;
font-size: 1.9rem;
}
ul.menu_sp_footer .search_icon:before {
content: "\f002";
}
ul.menu_sp_footer .favo_icon:before {
content: "\f005";
}
ul.menu_sp_footer .top_icon:before {
content: "\f062";
}
ul.menu_sp_footer .how_icon:before {
content: "\f599";
}
ul.menu_sp_footer .favorite02_icon {
margin-top: 2px;
}
ul.menu_sp_footer .favorite02_icon:before {
content: url("../images/heart_sp_icon.png");
}
ul.menu_sp_footer .follow_icon:before {
content: url("../images/follow_list_sp_icon.png");
}
ul.menu_sp_footer .menu_caption {
font-size: 0.9rem;
text-align: center;
opacity: 0.8;
display: block;
}
ul.menu_sp_footer .menu_caption.favorite02 {
margin-top: -1px;
}
ul.menu_sp_footer .menu_caption.follow {
margin-top: -1px;
}
ul.menu_sp_footer .drawer-hamburger {
top: 2px;
left: 50%;
-webkit-transform: translate(-50%,-50%); /* positionに対して要素を中央に配置させる */
transform: translate(-50%,-50%); /* positionに対して要素を中央に配置させる */
}
ul.menu_sp_footer .drawer-hamburger-icon:before {
top: 12px;
}
ul.menu_sp_footer .drawer-hamburger-icon .menu_caption {
padding-top: 9px;
}
/* modal window */
.modal{
display: none;
height: 100vh;
position: fixed;
top: 0;
width: 100%;
z-index: 1;
}
.modal__bg{
background: rgba(0,0,0,0.6);
height: 100vh;
position: absolute;
width: 100%;
}
.modal__content{
left: 50%;
padding: 40px;
position: absolute;
top: 50%;
transform: translate(-50%,-50%);
width: 100%;
}
.modal__content .search_box_02 {
position: relative;
margin: 1em 0em 1em 2em;
}
.modal__content .search_box_02 input {
width: 100%;
font-size: 1.6rem;
background: #fff;
padding: 11px;
border: 1px solid #ccc;
border-radius: 4px;
}
.modal__content .search_submit_02 {
position: absolute;
right: 3px;
top: calc(50% - 12px);
font-size: 20px;
cursor: pointer;
border: none;
color: #ddd;
padding: 0 8px;
background-color: rgba(255, 255, 255, 0);
}

/* ================================================
 
 contents
 
================================================ */

.content {
width: 100%;
background: #f4f5f7;
}
.content.top {
background: #fff;
}
.content.page {
padding-top: 10px;
}
.content.sign {
border-top: 10px solid #f4f5f7;
}
.main {
background: #fff;
}
@media screen and (min-width: 769px) {
  .content {
  padding: 12px 0px 20px;
  }
  .content.top {
  padding: 24px 0px 20px;
  background: #f4f5f7;
  }
  .content.page {
  padding: 24px 0px 20px;
  }
  .container {
  margin: 0px auto;
  width: 100%;
  max-width: 1256px;
  background: #fff;
  }
  .main {
  margin: 0px;
  padding: 20px 29px;
  border: 1px solid transparent;
  border-radius: 4px;
  }
}

/* ================================================
 
 breadcrumbs
 
================================================ */

.breadcrumbs {
color: #777;
font-size: 1.3rem;
background-color: #fff;
margin: 12px auto 10px;
padding: .6em 1em;
}
.breadcrumbs a {
color: #777;
font-size: 1.3rem;
}
.breadcrumbs div {
display: inline-block;
margin: 0 1px;
}
.fas_home {
text-align: center;
width: 1.25em;
}
.fas_home:before {
content: "\f015";
font-family: "Font Awesome 5 Free";
font-weight: 900;
}
.fas_holder:before {
content: "\f07b";
font-family: "Font Awesome 5 Free";
font-weight: 900;
}
.breadcrumbs .arrow {
margin: 0 10px;
display: inline-block;
}
.breadcrumbs .arrow:before {
content: "\f105";
font-family: "Font Awesome 5 Free";
font-weight: 900;
}
@media screen and (min-width: 769px) {
  .breadcrumbs {
  width: 100%;
  max-width: 1256px;
  margin: 0px auto 12px;
  }
}

/* ================================================
 
 top slider
 
================================================ */

.ec-slider-pc { display: block; }
@media screen and (max-width: 1195px) {
  .ec-slider-pc { display: none; }
}
.ec-slider-sp { display: none; }
@media screen and (max-width: 1195px) {
  .ec-slider-sp { display: block; }
}
@media screen and (min-width: 1196px) {
  .ec-slider-wrap {
  display: flex;
  width: 1196px;
  }
  .ec-slider-wrap .ec-slider-for {
  width: 75%;
  }
  .ec-slider-wrap .ec-slider-for img {
  width: 100%;
  height: auto;
  }
  .ec-slider-wrap .ec-slider-for img:hover {
  opacity: 0.7;
  }
  .ec-slider-wrap .ec-slider-nav {
  width: 25%;
  }
  .ec-slider-wrap .ec-slider-nav img {
  height: 133px;
  }
  .ec-slider-wrap .ec-slider-nav img:hover {
  opacity: 0.8;
  cursor: pointer;
  }
  .ec-slider-wrap .slick-list.draggable {
  height: 399px !important;
  overflow: hidden !important;
  }
  .ec-slider-nav.slick-vertical .slick-slide {
  border: none;
  margin-top: -50px;
  margin-bottom: 50px;
  }
  #img2, #img3, #img4 {
  display: none;
  }
}
@media screen and (max-width: 1195px) {
  .slick-img {
  width: 100%;
  margin: auto auto 16px;
  }
  .ec-slider-sp .slick-slide img {
  width: 100%;
  height: auto;
  }
  .ec-slider-sp .slider-nav .slick-list.draggable {
  padding: 0px !important;
  }
  .ec-slider-sp .slider-nav {
  width: 90%;
  margin-top: 10px;
  }
  .ec-slider-sp .slick-thumbnail {
  width: 90%;
  margin: auto;
  }
  .slick-thumbnail img {
  margin: auto;
  }
  .slick-thumbnail .slick-current img {
  width: 100%;
  }
  .slick-thumbnail .slick-current img.nav01 {
  border: 2px solid #f4b311;
  }
  .slick-thumbnail .slick-current img.nav02 {
  border: 2px solid #1bbc94;
  }
  .slick-thumbnail .slick-current img.nav03 {
  border: 2px solid #005c90;
  }
  .slick-thumbnail .slick-current img.nav04 {
  border: 2px solid #e22b48;
  }
  #img2, #img3, #img4 {
  display: none;
  }
}

/* bottom slider */

.slider-b {
margin: 30px auto 0px;
width: 98%;
}
.slider-b li {
position: relative;
}
.slider-b li a {
display: block;
padding: 0.2em 0.3em;
margin: 0 3px 3px;
width: 100%;
height: 100px;
overflow: hidden;
}
.slider-b li a:hover {
opacity: 0.7;
background: #fff7f2;
}
.slider-b img {
width: 100%;
height: 100%;
object-fit: scale-down;
}
/* 画像をエリアにフィットさせる
.slider-b img {
height: 100px;
object-fit: cover;
width: 100%;
}
*/
.slider-b p {
padding: 3px 0px 0px;
font-size: 1.3rem;
font-weight: 700;
line-height: 130%;
}
/* slick setting */
.slick-prev,
.slick-next {
font-size: 0;
line-height: 0;
position: absolute;
top: 50%;
display: block;
width: 20px;
height: 20px;
padding: 0;
color: #e5e5e5;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
cursor: pointer;
border: none;
outline: none;
background: transparent;
z-index: 1 !important;
}
.slick-next { right: -15px !important; }
.slick-prev:before,
.slick-next:before {
position: absolute;
font-family: "Font Awesome 5 Free" !important;
font-weight: 900;
font-size: 9px;
top: 0px;
color: #e5e5e5 !important;
}
.slick-prev:before {
content: '\f053' !important;
}
.slick-next:before {
content: '\f054' !important;
}
.slick-dotted.slick-slider {
margin-bottom: 40px !important;
}
.slick-dots {
bottom: -21px !important;
}
.slick-dots li {
width: 10px !important;
}
.slick-dots li button:before {
font-size: 2.0rem !important;
}

@media screen and (min-width: 769px) {
  .slider-b {
  width: 100%;
  margin: 50px auto 0px;
  }
  .slick-dots {
  bottom: -30px !important;
  }
  .slick-dots li {
  width: 15px !important;
  }
}
@media screen and (max-width: 768px) {
  .slick-prev,
  .slick-next {
  display: none !important;
  }
}

/* ================================================
 
 list
 
================================================ */
 
 /* search */
 
.top_search {
padding: 20px 0px 0px;
width: 100%;
}
.top_search .search_box {
position: relative;
margin: 1em 2em 1em 2em;
}
.top_search .search_submit {
right: -3px;
}
.top_search .bn_wrp {
width: 18%;
}
.list_title {
text-align: center;
font-size: 18px;
margin-top: 35px;
margin-bottom: 25px;
}
.list_title.search {
margin: 0px auto;
padding: 20px 0px;
width: 90%;
margin-bottom: 20px;
word-break: break-word;
}
.entry_title {
margin: 0 0 5px 0;
line-height: 1.6;
font-size: 1.5rem;
font-weight: 700;
word-break: break-all;
}
.list_title_in {
position: relative;
display: inline-block;
padding: 0px 75px;
font-size: 1.8rem;
font-weight: 700;
text-align: center;
}
.list_title_in:before,
.list_title_in:after {
content: '';
position: absolute;
top: 50%;
display: inline-block;
width: 55px;
height: 1px;
background-color: black;
}
.list_title_in:before {
left: 0;
margin-right: 10px;
}
.list_title_in:after {
right: 0;
margin-left: 10px;
}
.list_card,
.list_card_favo {
display: flex;
flex-wrap: wrap;
}
.list_card a.a_wrap,
.list_card_favo a.a_wrap {
margin: 0 0.16666% 5px;
padding: 7px;
display: inline-block;
width: 19.66%;
cursor: pointer;
border-radius: 10px;
transition: all 0.3s ease-in-out;
}
.list_card a.a_wrap:hover,
.list_card_favo a.a_wrap:hover {
color: #333;
background: #fff7f2;
}
figure.thumb {
position: relative;
width: 100%;
height: 150px;
overflow: hidden;
}
figure.thumb img {
width: 100%;
height: 100%;
object-fit: scale-down;
transition-duration: 0.3s;
}
figure.thumb img:hover {
opacity: 0.7;
transform: scale(1.1);
transition-duration: 0.3s;
}
/* 画像をエリアにフィットさせる
figure.thumb {
position: relative;
}
figure.thumb img {
height: 150px;
object-fit: cover;
width: 100%;
}
*/
.cate_label {
position: absolute;
top: 0.3em;
left: 0.3em;
padding: 0px 5px;
font-size: 1.1rem;
line-height: 180%;
color: #fff;
max-width: 80%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
background: #e22b48;
border: 1px solid #eee;
}
.list_more_button {
padding: 5px 0px 10px;
text-align: center;
}
a.list_more {
display: inline-block;
margin: 0;
padding: 0.3em 3em;
text-decoration: none;
color: #333;
border: solid 2px #ccc;
transition: .4s;
font-size: 16px;
border-radius: 99px;
}
a.list_more:hover {
color: #fff;
background: #e22b48;
border: 2px solid #e22b48;
}

@media screen and (max-width: 834px) {
  .list_title.search {
  margin-bottom: 0px;
  }
  .list_title_in {
  padding: 0px 45px;
  }
  .list_title_in:before,
  .list_title_in:after {
  width: 30px;
  }
  .list_card a.a_wrap {
  width: 33%;
  }
  figure.thumb {
  height: 100px;
  }
  .entry_title {
  font-size: 1.35rem;
  line-height: 1.5;
  }
  .list_more_button {
  padding: 5px 0px 0px;
  }
}

/* ================================================
 
 company
 
================================================ */

h1.listed_c {
padding: 30px 0px 0px;
font-size: 3.2rem;
font-weight: 700;
text-align: center;
}
.listed_read {
padding: 30px 30px 25px;
font-size: 1.5rem;
text-align: center;
}
.companies {
display: flex;
flex-wrap: wrap;
margin-top: 40px;
}
.companies a {
width: 14.28%;
}
.companies a:hover {
opacity: 0.7;
}
.companies figure,
.companies .figure {
margin-bottom: 25px;
display: flex;
flex-wrap: wrap;
flex-direction: column;
justify-content: center;
}
.companies .logos {
width: 100%;
height: 80px; /* 画像の高さ設定 */
padding: 0px 15%;
display: table;
table-layout: fixed;
}
.companies .logos .inner {
display: table-cell;
vertical-align: middle;
text-align: center;
width: 100%;
}
.companies .logos img {
max-width: 100%;
max-height: 80px; /* 画像の高さ設定 */
height: auto;
vertical-align: bottom;
object-fit: contain;
}
.companies .name {
padding: 0.3em 0.3em 1em;
flex: 1;
line-height: 1.3;
margin: 0px;
font-size: 1.35rem;
color: #333;
text-align: center;
}

@media only screen and (max-width: 599px) {
  h1.listed_c {
  padding: 25px 0px 0px;
  font-size: 2.6rem;
  }
  .listed_read {
  font-size: 1.0em; padding: 15px 0px 30px; text-align: center; line-height: 180%;
  }
  .companies { 
  margin-top: 20px;
  }
  .companies a {
  width: 35%;
  margin: 0px 5%;
  }
  .companies a:nth-of-type(odd) {
  margin-left: 10%;
  }
  .companies a:nth-of-type(even) {
  margin-right: 10%;
  }
  .companies a figure {
  margin-bottom: 10px;
  }
  .companies a .logos,
  .companies a .logos img {
  max-height: 40px; /* 画像の高さ設定 */
  }
}

/* ================================================
 
 contact
 
================================================ */

dl.contact input[type="radio"], dl.contact input[type="checkbox"], dl.contact02 input[type="radio"], dl.contact02 input[type="checkbox"] {
-moz-appearance: checkbox;
-webkit-appearance: checkbox;
appearance: checkbox;
margin: 0px 0px 0px 15px !important;
padding: 6px !important;
width: auto !important;
font-size: 1.6rem !important;
color: #282e35 !important;
line-height: normal !important;
border: solid 1px #a6a8ad !important;
border-radius: 1px !important;
}
dl.contact dd input,
dl.contact dd textarea,
dl.contact02 dd input,
dl.contact02 dd textarea {
margin: 0px;
padding: 10px;
width: 100%;
font-size: 1.5rem;
background: #fff;
border: 1px solid #d8d8d8;
border-radius: 5px;
}
dl.contact dd textarea,
dl.contact02 dd textarea {
height: 100px;
}
dl.contact, dl.contact02 {
width: 90%;
max-width: 800px;
margin: 20px auto 0px;
}
dl.contact dt:first-child,
dl.contact02 dt:first-child {
padding-top: 0px;
}
dl.contact dt, dl.contact02 dt {
margin: 0px;
padding: 15px 0px 5px;
width: 100%;
font-size: 1.5rem;
font-weight: 700;
}
dl.contact dd, dl.contact02 dd {
margin: 0px;
padding: 0px;
}
.contact_attention {
margin: 0px 10px 15px;
text-align: center;
}
.bn_area {
margin: 0px auto;
width: 50%;
max-width: 270px;
}
.btn__link {
padding: 10px 0px;
width: 100%;
font-size: 1.9rem;
text-align: center;
color: #fff;
background: #e22b48;
border-radius: 5px;
cursor: pointer;
transition-duration: 0.3s;
}
.btn__link:hover {
text-shadow: 0px 0px 5px #e22b48,0px 0px 5px #e22b48;
background: #ff3c5b;
transition-duration: 0.3s;
}
.recaptcha_bg {
margin: 20px auto 25px;
padding: 10px;
width: 70%;
min-width: 335px;
max-width: 550px;
font-size: 14px;
text-align: center;
color: #505050;
background: #fff0f0;
border-radius: 5px;
}
.recaptcha_bg a {
color: #c67884;
}
.recaptcha_bg a:hover {
color: #e22b48;
}
span.external_icon {
display: inline-block;
margin-left: 3px;
font-size: 0.8em;
font-family: "Font Awesome 5 Free";
font-weight: 900;
}
span.external_icon:before {
content: "\f35d";
}
dl.contact .frmttl {
display: inline-block;
width: 16%;
padding: 0px;
font-size: 1.5rem;
}
dl.contact .chu {
display: block;
padding: 5px 0px 0px;
font-size: 1.3rem;
color: #505050;
line-height: 140%;
}
dl.contact .mr30 { margin-right: 30px !important; }
dl.contact.mb10 { margin-top: 25px; margin-bottom: 10px; }

/* orange gray */
dl.contact .required,
dl.contact02 .required {
color: #e54530;
font-weight: 700;
}
dl.contact dd.gray,
dl.contact02 dd.gray {
color: #e22b48;
}

/* deliver */
.add_ttl {
margin-top: 25px !important;
padding: 10px 0px 10px 15px !important;
font-size: 1.8rem;
font-weight: bold;
text-align: center;
background: #dcdfe6;
}
.contact_ttl {
padding: 20px 0px 0px;
font-size: 2.2rem;
font-weight: 700;
text-align: center;
}
dl.contact02 .nice-select {
float: none;
border-color: #d8d8d8;
}
dl.contact label {
border-radius: 3px;
margin: 0px;
display: inline-block;
}
dl.contact ul.add_ress {
margin: 0px;
padding: 0px;
}
dl.contact ul.add_ress li {
padding: 0px 0px 5px 0px;
}
dl.contact ul.add_ress li:last-child {
padding: 0px 0px 0px 0px;
}

@media only screen and (min-width: 835px) {
  dl.contact dd input, dl.contact dd textarea,
  dl.contact02 dd input, dl.contact02 dd textarea {
  padding: 15px;
  }
  dl.contact dd textarea,
  dl.contact02 dd textarea {
  height: 200px;
  }
  dl.contact, dl.contact02 {
  display: flex;
  flex-wrap: wrap;
  margin-top: 40px;
  border-top: 1px solid #dbd8d8;
  border-left: 1px solid #dbd8d8;
  }
  dl.contact02 {
  margin-top: 30px;
  }
  dl.contact.checked, dl.contact02.checked {
  border-top: 1px solid #eeadad;
  }
  dl.contact dt, dl.contact02 dt {
  display: flex;
  align-items: center;
  width: 30%;
  padding: 15px;
  font-size: 1.6rem;
  background: #f7f7f7;
  border-right: 1px solid #dbd8d8;
  border-bottom: 1px solid #dbd8d8;
  }
  dl.contact dt:first-child {
  padding: 15px;
  }
  dl.contact dd, dl.contact02 dd {
  width: 70%;
  padding: 20px 15px;
  font-size: 1.6rem;
  border-right: 1px solid #dbd8d8;
  border-bottom: 1px solid #dbd8d8;
  }
  dl.contact02 dd#select {
  padding: 10px 15px 20px 14px;
  }
  dl.contact .orange,
  dl.contact02 .orange {
  background: #fff0f0;
  border-right: 1px solid #eeadad;
  border-bottom: 1px solid #eeadad;
  }
  dl.contact dd.gray,
  dl.contact02 dd.gray {
  border-right: 1px solid #eeadad;
  border-bottom: 1px solid #eeadad;
  }
  .add_ttl {
  width: 90%;
  max-width: 800px;
  margin: 0px auto;
  border-radius: 5px;
  margin-top: 35px !important;
  }
  .contact_attention {
  margin: 20px 10px 40px;
  }
  .btn__link {
  padding: 15px 0px;
  width: 100%;
  font-size: 2.1rem;
  }
  .recaptcha_bg {
  margin: 30px auto 25px;
  }
  .contact_ttl {
  padding: 25px 0px 0px;
  font-size: 2.5rem;
  }
  dl.contact .nice-select,
  dl.contact02 .nice-select {
  width: 50% !important;
  }
}
@media only screen and (max-width: 834px) {
  dl.contact .frmttl {
  width: 26%;
  margin: 0px 8px 0px 0px;
  white-space: nowrap;
  }
  dl.contact .gray,
  dl.contact02 .gray {
  padding: 10px 10px;
  background: #fff1ea;
  border-radius: 5px;
  }
  dl.contact .orange,
  dl.contact02 .orange,
  dl.contact .orange:first-child,
  dl.contact02 .orange:first-child {
  padding-top: 10px;
  padding-bottom: 5px;
  }
  dl.contact .orange:before,
  dl.contact02 .orange:before {
  content: "■";
  display: inline-block;  
  }
  .grecaptcha-badge {
  bottom: 70px !important;
  }
  dl.contact .block {
  display: block;
  width: 100%;
  margin-bottom: 15px;
  }
  .mr30 {
  margin-right: 0px !important;
  }
  .nofloat {
  clear: both;
  }
}
/* input size */
@media (min-width: 768px) {
  .width_01 {
  width: 85% !important;
  }
  .width_02 {
  width: 25% !important;
  }
  .width_03 {
  width: 28% !important;
  }
  .style01 {
  width: 100% !important;
  height: 150px !important;
  }
}
@media (max-width: 767px) {
  .width_01 {
   width: 95% !important;
  }
  .width_02 {
   width: 45% !important;
  }
  .width_03 {
   width: 30% !important;
  }
  .style01 {
  width: 100% !important;
  height: 100px !important;
  }
}

/* thanks */

h1.listed_c.h1_thanks {
padding: 50px 20px 15px;
line-height: 130%;
}
.thanks_wrp {
margin: 50px auto 60px;
padding: 60px 50px 30px;
width: 90%;
max-width: 1000px;
text-align: center;
background: #f4f5f7;
}
.thanks_wrp img.thanks_txt {
width: 100%;
max-width: 433px;
height: auto;
margin: 0px 0px 25px;
}
.thanks_wrp img.thanks_img {
width: 100%;
max-width: 237px;
height: auto;
margin: 0px 0px 20px;
}
.thanks_txt {
font-size: 1.8rem;
text-align: center;
padding: 0px;
margin: 0px;
line-height: 200%;
}
.thanks_read {
font-size: 1.65rem;
text-align: center;
padding: 0px 0px 30px;
margin: 0px;
line-height: 200%;
}
.thanks_wrp .search_banner {
margin: 0px auto 25px;
}
@media (max-width: 425px) {
  h1.listed_c.h1_thanks {
  padding: 30px 20px 10px;
  font-size: 2.4rem;
  line-height: 110%;
  }
  .thanks_wrp {
  margin: 15px auto 30px;
  padding: 25px 20px 0px;
  }
  .thanks_read {
  font-size: 1.45rem;
  padding: 0px 0px 20px;
  line-height: 170%;
  }
  .thanks_read.thanks_left {
  text-align: left;
  padding: 0px 0px 15px;
  }
  .thanks_wrp .search_banner {
  width: 90%;
  margin: 5px auto 15px;
  font-size: 2.3rem;
  }
  .thanks_wrp img.thanks_txt {
  margin: 0px 0px 15px;
  }
  .thanks_wrp img.thanks_img {
  max-width: 200px;
  }
}

/* ================================================
 
 about
 
================================================ */

table.table_company {
width: 90%;
max-width: 900px;
margin: 15px auto 20px;
}
table.table_company th,
table.table_company td {
padding: 10px 15px;
font-size: 1.4rem;
line-height: 1.4;
vertical-align: middle;
border: 1px solid rgba(255,106,0,.5);
white-space: normal;
}
table.table_company th {
background: #ffe9d9;
}
table.table_company th.second {
background: #fff0e5;
}
table.table_company td {
background: #fff7f2;
}
table.table_company td.second {
background: #fff;
}
@media screen and (min-width: 835px){
  table.table_company {
  margin: 30px auto 20px;
  }
  table.table_company th,
  table.table_company td {
  padding: 18px 25px;
  font-size: 1.5rem;
  line-height: 1.5;
  }
}

/* 404 */

.error_read {
padding: 20px 20px 0px;
text-align: center;
}
.error {
width: 70%;
max-width: 400px;
margin: 30px auto;
}
.error img {
width: 100%;
height: auto;
}

/* search */

.search_none {
padding: 15px 30px 0px;
text-align: center;
}
.search_none h2.h2_search {
font-size: 2.0rem;
line-height: 160%;
}
.search_none img {
width: 80%;
max-width: 350px;
height: auto;
margin: 20px auto 20px;
}
.search_none p {
font-size: 1.7rem;
margin-bottom: 15px;
}
a.search_banner {
display: block;
position: relative;
margin: 25px auto 45px;
padding: 18px 0px;
width: 80%;
max-width: 320px;
font-size: 2.5rem;
text-align: center;
color: #fff;
background: #eb9937;
border-radius: 5px;
box-shadow: 0px 0px 8px #ddd;
text-decoration: none;
transition: all 0.3s ease-in-out;
}
a.search_banner:hover {
color: #fff;
background: #ea5506;
transition: all 0.3s ease-in-out;
}
a.search_banner:after {
content: "\f054";
position: absolute;
font-family: "Font Awesome 5 Free";
font-weight: 900;
top: 50%;
right: 10px;
font-size: 1.6rem;
transition: all .2s ease;
-webkit-transform: translate(-50%,-50%); /* positionに対して要素を中央に配置させる */
transform: translate(-50%,-50%); /* positionに対して要素を中央に配置させる */
}
@media screen and (max-width: 834px){
  .search_none {
  padding: 0px 30px 0px;
  }
  .search_none p {
  text-align: left;
  font-size: 1.6rem;
  }
}

/* ================================================
 
 footer
 
================================================ */

footer {
width: 100%;
margin-top: 20px;
padding: 24px 24px 65px;
color: #fff;
background: #252525;
}
.footer_in {
display: flex;
flex-direction: column;
}
.f_contact {
padding: 5px 20px;
background: none;
text-align: center;
}
.f_logo {
width: 170px;
margin: 0px auto;
text-align: center;
}
.f_logo img {
width: 100%;
height: auto;
}
.f_message {
margin-top: 0.5em;
padding-top: 5px;
font-size: 1.4rem;
line-height: 1.5;
}
.f_button {
position: relative;
margin-top: 1em;
}
.f_button a {
display: flex;
justify-content: center;
align-items: center;
padding: 0.45em;
font-size: 2.0rem;
font-weight: bold;
border-radius: 4px;
color: #fff;
background: #e22b48;
border: 1px solid #e22b48;
cursor: pointer;
transition-duration: 0.3s;
}
.f_button a:hover {
text-shadow: 0px 0px 3px #e22b48,0px 0px 5px #e22b48;
background: #ff3c5b;
border: 1px solid #ff3c5b;
transition-duration: 0.3s;
}
.f_button a:after {
content: "\f054";
position: absolute;
font-family: "Font Awesome 5 Free";
font-weight: 900;
display: inline-block;
font-size: 1.6rem;
right: 20px;
transition: all .2s ease;
}
ul.f_list {
display: flex;
flex-wrap: wrap;
margin-top: 7px;
font-size: 1.4rem;
}
ul.f_list li {
width: 48%;
}
ul.f_list li a {
position: relative;
padding: 3px 0px 3px 20px;
color: #fff;
line-height: 190%;
}
ul.f_list li a:hover {
transition: all 0.3s ease-in-out;
}
ul.f_list li a:before { 
content: "\f054";
position: absolute;
font-family: "Font Awesome 5 Free";
top: 0px;
left: 6px;
font-size: 1.2rem;
font-weight: 900;
color: #999;
}
.f_cate {
display: none;
}
.copyright {
margin: 20px auto 0px;
text-align: center;
padding-top: 10px;
width: 100%;
max-width: 1256px; 
border-top: 1px solid #777;
font-size: 1.1rem;
color: #999;
letter-spacing: 0.05em;
}
.nice-select .list {
  height: 300px;
  }
  .nice-select.open .list {
  width: 100%;
  height: 300px;
  overflow-x: hidden;
  overflow-y: visible;
  }
@media screen and (min-width: 835px) {
  footer {
  margin: 0px;
  padding: 35px 28px 10px;
  }
  .footer_in {
  flex-direction: row-reverse;
  width: 100%;
  max-width: 1256px;
  margin: 0px auto;
  }
  .f_cate,
  ul.f_list,
  .f_contact {
  width: 33.33%;
  padding: 0px 20px;
  margin: 0px;
  }
  .f_contact {
  padding: 5px 25px;
  }
  .f_contact p {
  padding: 0px 20px;
  }
  ul.f_list {
  align-content: flex-start;
  }
  ul.f_list li a {
  line-height: 250%;
  }
  ul.f_list li a:before { 
  top: -5px;
  }
  .f_cate {
  display: block;
  }
  .f_cate h3.h3_foot {
  font-size: 1.5rem;
  font-weight: 700;
  color: #fff;
  }
  .nice-select.wide {
  margin-bottom: 20px;
  }
  .nice-select {
  margin-top: 10px;
  color: #333;
  }
  footer .nice-select .list {
  top: auto !important;
  bottom: 42px;
  color: #000;
  }
  .nice-select .option:hover, .nice-select .option.focus, .nice-select .option.selected.focus {
  background: #fff0f0 !important;
  color: #e22b48;
  font-weight: 700;
  }
  .tagcloud {
  margin: 7px 0px 5px;
  }
  .tagcloud a {
  display: inline-block;
  margin: 2px 1px 5px 0px;
  padding: 2px 8px;
  color: #fff;
  border: 1px solid rgba(255,60,91,.5);
  border-radius: 2px;
  font-size: 1.2rem;
  line-height: 160%;
  }
  .tagcloud a:hover {
  background-color: rgba(255,60,91,.8);
  }
  .tagcloud .tag_caption {
  word-break: break-all;
  display: inline-block;
  line-height: 1;
  }
  .tagcloud .tag_caption {
  display: inline-block;
  line-height: 1;
  }
  .tagcloud .tag_caption:before {
  content: "\f02b";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 1.2rem;
  line-height: 1;
  margin-right: 3px;
  }
  .copyright {
  padding-top: 8px;
  }
}