
@charset "utf-8";
/*
Theme Name: Template
Author: 3eee
Author URI: https://3eee.co.jp/
Description: Template build.
Version: 1.0
*/


/*** ページ専用 共通CSS設定 ***/

.business_block {
    background: #ffffff61;
    margin-bottom: var(--margin_xs);
}

.business_block:last-child {
    margin-bottom: 0;
}

.business_block dl {
	width: 100%;
    position: relative;
}

.business_block dl dt {
    position: absolute;
    top: 0;
    background: #fff;
    z-index: 1;
    padding: var(--margin_xxs) var(--margin_xs);
    border-radius: 0 0 15px 0;
    font-size: var(--fs_h5);
	font-weight:700;
}

.business_block dl dd{
    min-height: 200px;
    max-height: 300px;
    overflow: hidden;
	font-size: var(--fs_xs);
}

.business_block dl dd img {
	width: 100%;
    height: auto;
    min-height: 200px;
    max-height: 300px;
    object-fit: cover;
    object-position: center top;
    padding: 0;
    margin: 0;
}

.businesslink_wra {
	display: flex;
    flex-wrap: wrap;
    align-content: space-between;
    justify-content: space-between;
	margin-bottom: var(--margin_s);
}

.businesslink {
	width: 42%;
    background: #fff;
    padding: var(--margin_xs);
    margin: 0 0 3% 0;
    font-size: var(--fs_xs);
    font-weight: normal;
    line-height: 150%;
    display: flex;
    justify-content: space-between;	
}

.businesslink a {
	width:100%;
    display: flex;
    justify-content: space-between;	
	color:#000;
}

.linkbtn{
	position: relative;
    display: inline;
    padding: 0 25px 0 0;
}

.linkbtn:before {
	content: '';
    width: 16px;
    height: 16px;
    background: #c5c5c5;
    border-radius: 50%;
    position: absolute;
    top: 3px;
    right: 0;
    bottom: 0;
    margin: auto;
}

.linkbtn:after {
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 6px;
    border-color: transparent transparent transparent #fff;
    position: absolute;
    top: 2px;
    right: 4px;
    bottom: 0;
    margin: auto;
}

.businesslink a:hover {
	opacity:0.6;
	color:#000;
}

.businesslink dt {
	font-weight: 700;
    font-size: var(--fs_s);
    width: 70%;
}

.businesslink dt span{
	font-size: var(--fs_xs);
    font-weight: normal;
    display: block;
    margin: var(--margin_xxs) 0 0 0;
}

.businesslink dd {
    width: 25%;
	text-align: center;
    height: 100%;
    display: flex;
    align-items: center;
}

.businesslink dd img {
	width: 100%;
}

.business_block div{
	padding: var(--margin_xs);
}

.business_block ul {
	display: flex;
    flex-wrap: wrap;
    gap: var(--margin_xxs);
	margin-top: var(--margin_xxs);
}

.business_block li{
    border-radius: 10px;
    width: fit-content;
    padding: 0.2em var(--margin_xs);
}

.busi_cate01 li{
    background: #1c9f330f;
    color: #1c9f33;
}

.busi_cate02 li{
    background: #ff652814;
    color: #ff6528;
}

.busi_cate03 li{
    background: #3b7abd14;
    color: #3b7abd;
}

/*------------------------------

ここからアコーディオンのCSS

------------------------------*/

.accordion {
	padding: 0 !important;
}

/* チェックボックスを非表示にする */
.accordion-hidden{
	display: none;
}

/* Question部分 */
.accordion-open {
    display: block;
    cursor: pointer;
	text-align: right;
}

/* Answer部分は最初は表示しない */
.accordion-close {
	display: block;
	height: 0;
	overflow: hidden;
	padding: 0;
	opacity: 0;
	transition: 0.5s;/* 表示速度の設定 */
    display: flex;
    width: 90%;
    margin: 0 auto;
}

.accordion-close dt{
    position: static !important;
    background: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    font-size: var(--fs_xs) !important;
    border-style: solid;
    border-width: 0 0 2px 0;
	border-color:#666;
    width: fit-content;
	margin: var(--margin_xs) 0 0.5em 0;
}

.accordion-close dd{
    min-height: auto!important;
    max-height: 100%!important;
}

.accordion-close dd span{
    display: block;
	font-weight: 400;
    padding: 0.3em 0 0 1em;
}

.accordion-close dd span a{
   color:#000;
}

.accordion-close dd span a:hover{
   font-weight:600;
}


/* チェックボックスにチェックが入ったらAnswer部分を表示 */
.accordion-hidden:checked + .accordion-open + .accordion-close {
  height: auto;
  opacity: 1;
}


#business_b div img,#business_c div img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    min-width: 400px;
    margin-bottom: var(--margin_xxs);
}

#business_b dl , #business_c dl{
    margin-bottom: var(--margin_xs);
}

#business_b dl dt ,#business_c dl dt{
    line-height: 120%;
    margin: 0 0 var(--margin_xs) 0;
	font-size: var(--fs_h5);
    font-weight: 700;
}

#business_b dl dt img , #business_c dl dt img{
	max-width: 300px;
    display: block;
    margin-bottom: var(--margin_xs);
}
/*
.m_list2 li a {
    display: block;
    width: 100%;
    text-align: center;
    padding: var(--margin_s) 0;
    display: block;
}
*/

.img-wrap {
    height: auto;
    max-width: 100%;
    margin: 0 auto var(--margin_xl) auto;
}


/*----------------------------------------*/


/*　スマホ
----------------------------------------*/
@media screen and (max-width: 768px) {
	
	.business_block ul {
	    margin: var(--margin_xs) 0;
	}
	
	.business_block li {
	    font-size: 85%;
	}
	
	.business_block div {
		padding: var(--margin_xs) var(--margin_s);
	}
	
	#business_b dl dt img, #business_c dl dt img {
		margin: 0 auto var(--margin_s) auto;
	}
	
	#business_b dl dt, #business_c dl dt {
		margin-bottom: var(--margin_s);
        background: #fff;
        padding: var(--margin_s) var(--margin_xs);
        text-align: center;
	}

	.accordion,.accordion-close {
		width:100%!important;
	    font-size: 90%!important;
	}
	
	.accordion-close {
		display: block;
	}
	
	.business_block dl dd {
	    line-height: 130%;
		display: flex;
		flex-wrap: wrap;
	}
	
	.business_block dl dd span	{
		position: relative;
		display: inline-block;
		margin-right:1.5em;
	}
	
	.business_block dl dd span:before {
		content: '';
        width: 0.5em;
        height: 0.5em;
        border: 0;
        border-top: solid 2px #333;
        border-right: solid 2px #333;
        transform: rotate(45deg);
        position: absolute;
        top: 0.2em;
        left: 0;
        bottom: 0;
        margin: auto;
	}
	
	.accordion-close dt {
		border: 0;
		width: 100%;
		background: #ffffff !important;
		padding: 0 var(--margin_xxs) !important;
	}
	
	.accordion-close dt{ 
		font-size: var(--fs_xxs) !important;
	}
	
	.accordion-close dd{ 
		font-size: var(--fs_xxs) !important;
	}
	
	.businesslink {
		width:100%;
	}
	
	.businesslink dt{
		font-size: var(--fs_xxs);
		font-weight: 400;
		display: flex;
        align-items: center;
		font-size:85%;
	}
	
	.businesslink dt span{
		display: none;
	}

	.businesslink dd{
		width:auto;
		max-width: 6em;
	}
	
}

/*　タブレット
----------------------------------------*/
@media screen and (min-width: 768px) and (max-width: 1280px) {

	.businesslink {
		width:100%;
	}
}

@media screen and (min-width: 768px) and (max-width: 900px) {

}

/*　PC
----------------------------------------*/
@media screen and (min-width: 1280px) {

}