/* CSS Document */

.main_ber{
	display: flex;
	height:clamp(64px, 9vw, 88px);
}

.main_ber img{
	float: left;
	margin-left: -2px;
}

/* ======= ビジネスツール (business) ============================================== */ 

#business .main_ber{
	display: flex;
	height:clamp(65px, 11vw, 88px);
}

#business .content_ber {
	font-family: "Noto Sans JP", sans-serif;
	width: 88%;
	padding: 1.5% 1% 1% 2%;
	background-color: rgb(110, 185, 68);
	color:rgba(255, 255, 255, 1);
}

#business .cont_txt2 {
  color: rgb(110, 185, 68) !important;
}

/* ======= ホームページデザイン (webdesign) ============================================== */ 

#webdesign .main_ber{
	display: flex;
	height:clamp(65px, 11vw, 88px);
}

#webdesign .content_ber{
	font-family: "Noto Sans JP", sans-serif;
	width: 80%;
	min-width: 310px;
	padding: 1.5% 1% 1% 2%;
	background-color: rgb(121, 107, 175);
	color:rgba(255, 255, 255, 1);
}

#webdesign .cont_txt2 {
  color: rgb(121, 107, 175) !important;
}


/* ======= リーフレット・ショップカード (Leaflet) ============================================== */ 

#Leaflet .main_ber{
	display: flex;
	height:clamp(65px, 9vw, 88px);
}

#Leaflet .content_ber {
	font-family: "Noto Sans JP", sans-serif;
	width: 80%;
	min-width: 310px;
	padding: 1.5% 1% 1% 2%;
	background-color: rgb(233, 96, 158);
	color:rgba(255, 255, 255, 1);
}

#Leaflet .ber_txt1 {
	font-size: clamp(20px, 3.5vw, 35px);
	letter-spacing: -1px;
	margin-bottom: 1%;
}

#Leaflet .cont_txt2 {
  color: rgb(233, 96, 158) !important;
}

/* ======= 会社案内製作 (corptool) ============================================== */ 

#corptool{
	font-family: "Noto Sans JP", sans-serif;
}

#corptool .main_ber{
	display: flex;
	height:clamp(65px, 8vw, 88px);
}

#corptool .content_ber{
	width: 80%;
	min-width: 310px;
	padding: 1.5% 1% 1% 2%;
	background-color: rgb(233, 85, 31);
	color:rgba(255, 255, 255, 1);
}

#corptool .ber_txt1 {
	font-size: clamp(20px, 3.5vw, 35px);
  color: rgb(255, 255, 0) !important;
	margin-bottom: 1%;
}

#corptool .ber_txt3 {
	margin:0% 2% 0% 5%;
	font-family: メイリオ, Meiryo, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", sans-serif;
	font-size: clamp(13px, 1.8vw, 17px);
	line-height:1.5em;
	letter-spacing: 0.5px;
}

#corptool .cont_txt2 {
	font-size: clamp(13px, 1.8vw, 18px);
	font-weight: 600;
	margin-bottom: 1%;
}

#corptool .text_box {
  display: flex;
	align-items: flex-start;  /* これで左右の要素が上寄せに */
  gap: 5px;          /* 要素間の余白 */
}

#corptool .cont_box1 {
	margin-left: 2%;
	height:  clamp(18px, 2.5vw, 25px);
	color:rgb(233, 85, 31);
  border-width: 1px 1px 1px 1px;
  border-style: solid;
	border-color: rgb(233, 85, 31);
	background-color: rgb(255, 241, 180);
}

#corptool .cont_box2 {
	margin-left: 2%;
  border-width: 0px 1px 1px 1px;
  border-style: solid;
	border-color: rgb(233, 85, 31);
	text-align: center;
	margin-bottom: 4%;
}

#corptool .cont_box3 {
	display: flex;
	margin-left: 2%;
  border-width: 0px 1px 1px 1px;
  border-style: solid;
	border-color: rgb(233, 85, 31);
	margin-bottom: 4%;
}

#corptool .cont_txt3 {
min-width: 310px;
}

.panph_image1 {
  max-width: 290PX;
}

.panph_image2 {
	margin: 4% 0% 1% 0%;
  width: 85%;
  height: auto;
}

.panph_image3 {
	margin: 4% 0% 2% 2%;
  width: 25%;
  height: auto;
}

.panph_image4 {
	margin: 4% 0% 2% 2%;
  width: 160%;
	min-width: 80px;
	height: auto;
}

.cont_txt4 {
	margin: 3% 3% 2% 3%;
	font-size: clamp(13px, 1.5vw, 16px);
  text-align: left;
	line-height:1.3em;
}


/* ======= 展示会ツール (exhibitiontool) ============================================== */ 

#exhibitiontool{
	font-family: "Noto Sans JP", sans-serif;
}

#exhibitiontool .main_ber{
	display: flex;
	height:clamp(65px, 9vw, 88px);
}

#exhibitiontool .content_ber{
	width: 80%;
	min-width: 310px;
	padding: 1.5% 1% 1% 2%;
	background-color: rgb(0, 151, 60);
	color:rgba(255, 255, 255, 1);
}

#exhibitiontool .ber_txt1 {
	font-size: clamp(24px, 3.5vw, 35px);
  color: rgb(255, 255, 0) !important;
	margin-bottom: 1%;
}

#exhibitiontool .cont_txt1{
	margin-left: 5%;
	margin-top: 3%;
	margin-bottom: 2%;
	color: rgb(0, 151, 60) !important;
	font-size: clamp(20px, 3vw, 30px);
}

#exhibitiontool .cont_box1 {
	width: 100%;
	text-align: center;
}

#exhibitiontool .cont_image1 {
	width: 80%;
	margin-bottom: 5%;
}

.cont_triangle {
	margin: 4% auto 4% auto;
  width: 100px;
  height: 35px;
  background-color: rgb(240, 240, 0);
  clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
}

#exhibitiontool .cont_ber {
	width: 42%;
	min-width: 240px;
	margin: 0% auto 3% auto;
	background-color: rgb(0, 151, 60);
	text-align: center;
	border-radius: 5px 5px 5px 5px; /* 角を丸くする */
}

#exhibitiontool .cont_txt2{
	padding: 3% 1% 4% 1%;
  color: rgb(255, 255, 0) !important;
	font-size: clamp(16px, 2vw, 24px);
}

/* ======= コンセプト (concept) ============================================== */ 

#concept{
	font-family: "Noto Sans JP", sans-serif;
}

#concept .main_ber{
	display: flex;
	height:clamp(65px, 9vw, 88px);
}

#concept .content_ber{
	width: 80%;
	min-width: 310px;
	padding: 1.5% 1% 1% 2%;
	background-color: rgb(198, 0, 11);
	color:rgba(255, 255, 255, 1);
}

#concept .ber_txt1 {
	font-size: clamp(22px, 3.3vw, 33px);
	margin-bottom: 1%;
}

#concept .cont_txt1{
	margin-left: 2%;
	margin-top: 3%;
	margin-bottom: 2%;
	color: rgb(198, 0, 11) !important;
	font-size: clamp(16px, 3vw, 30px);
	font-weight: 330;
	line-height:1.5em;
}

#concept .cont_txt3{
	width: 90%;
  font-family: "Noto Serif JP", YuMincho, "Yu Mincho", "Hiragino Mincho ProN", serif;
	font-size: clamp(14px, 1.8vw, 18px);
	font-weight: 400;
	line-height:1.7em;
}

.sign {
	margin: 3% 8%;
	text-align: right;
}

/* ======= 会社情報 (company) ============================================== */ 

#company {
	font-family: "Noto Sans JP", sans-serif;
}

.company_box {
	width: 90%;
	margin: 3% auto 4% auto;
}

#company .content_ber{
	display: flex;
	position: relative;
	align-items: flex-end;
}

#company .ber_txt1 {
	width: 58%;
	padding: 0% 2% 1% 0%;
	font-size: clamp(20px, 2.8vw, 28px);
	letter-spacing:0.2em; 
	margin-bottom: 0%;
	border-bottom-width: 3px;
	border-bottom-style: solid;
	border-color: rgb(235, 0, 11);
	color: rgb(235, 0, 11);
}

#company .ber_txt2 {
	width: clamp(135px, 18vw, 185px);
	padding: 0% 0% 0.5% 0%;
	font-size: clamp(11px, 1.4vw, 15px);
	letter-spacing:0.1em; 
	vertical-align: bottom;
	margin-bottom: 0%;
	border-bottom-width: 3px;
	border-bottom-style: solid;
	border-color: rgb(235, 170, 100);
	color: rgb(235, 0, 11);
  white-space: nowrap; /* 改行しない */

}

#company table {
	width: 100%;
	border-collapse:collapse;
	font-size: clamp(13px, 1.6vw, 16px);
	line-height:1.3em;
	}

#company th{

	width: 15%;
	text-align:right;
	vertical-align:top;
	padding: 2% 1.5% 1% 0%;
	border-right-width: 2px;
	border-right-style: solid;
	border-color: rgb(235, 170, 100);
	font-weight: 450;
	}

#company td{
	font-weight: 350;
	margin:0px;
	padding: 2% 0% 1% 1.5%;
	vertical-align:top;
	}

#company tr{
	margin:0;
	padding:0;
	}

/* ======= プライバシーポリシー (company) ============================================== */ 

#privacy {
	font-family: "Noto Sans JP", sans-serif;
}

.privacy_box {
	width: 90%;
	margin: 3% auto 4% auto;
}

#privacy .content_ber {
	display: flex;
	position: relative;
	align-items: flex-end;
}

#privacy .ber_txt1 {
	width: 70%;
	padding: 0% 2% 1% 0%;
	font-size: clamp(20px, 2.8vw, 28px);
	letter-spacing:0.1em; 
	margin-bottom: 0%;
	border-bottom-width: 3px;
	border-bottom-style: solid;
	border-color: rgb(235, 0, 11);
	color: rgb(235, 0, 11);
}

#privacy .ber_txt2 {
	width: clamp(88px, 11vw, 120px);
	padding: 0% 0% 0.5% 0%;
	font-size: clamp(11px, 1.4vw, 15px);
	letter-spacing:0.1em; 
	vertical-align: bottom;
	margin-bottom: 0%;
	border-bottom-width: 3px;
	border-bottom-style: solid;
	border-color: rgb(235, 170, 100);
	color: rgb(235, 0, 11);
  white-space: nowrap; /* 改行しない */
}

#privacy .cont_txt2{
	margin-top: 4%;
	margin-bottom: 3%;
	font-size: clamp(16px, 2.5vw, 22px);
	font-weight: 400;
	line-height:1.5em;
}

#privacy .cont_txt3{
  font-family: "Noto Serif JP", YuMincho, "Yu Mincho", "Hiragino Mincho ProN", serif;
	font-size: clamp(14px, 1.5vw, 18px);
	font-weight: 400;
	line-height:1.6em;
}

#privacy ul {
	padding-left:2ch;
	list-style-type: decimal;
}

/* ========== 共　通 ================================= */

.ber_txt1{
	font-size: clamp(24px, 3.5vw, 32px);
	margin-bottom: 1%;
}

.ber_txt2{
	font-size: clamp(13px, 1.7vw, 18px);
	font-weight: 400;
	line-height:1.2em;
}

.content_box{
  font-family: "Noto Sans JP", sans-serif;
	margin:0% 6% 2% 2%;
}

.cont_txt1{
	margin-top: 3%;
	margin-bottom: 2%;
	font-size: clamp(20px, 3vw, 30px);
}

.cont_txt2{
	margin-left: 2%;
	margin-bottom: 2%;
	font-size: clamp(16px, 3vw, 26px);
	font-weight: 350;
	letter-spacing: -0.05em; /* 圧縮 */

}

.cont_txt3{
	margin:0% 2% 0% 5%;
	font-family: メイリオ, Meiryo, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", sans-serif;
	font-size: clamp(13px, 1.8vw, 17px);
	line-height:1.5em;
	letter-spacing: 0.5px;
	}

.flow{
  display: block;
	width: 80%;
	margin:0% auto 5% auto;
}

@media(max-width:440px){
	.text_box {
		flex-direction: column;
		align-items: center; /* 垂直方向の位置を調整 */
	}

	#concept .cont_txt1 br {
	  display: none;
	}

	#privacy .ber_txt1 {
		font-size: clamp(20px, 2.8vw, 28px);
		letter-spacing:-0.1em; 
	}

	.flow{
		display: block;
		width: 95%;
		margin:0% auto 5% auto;
	}
	
}