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

/*全体*/

section{
	margin-bottom: 3rem;
}

h1{
	margin-top:1rem;
}

h2, h1{
	font-size: 2rem;
	font-weight: 700;
	color: #0ea280;
	text-align: center;
	margin-bottom: 1.5rem;
	background: #ebf3d7;
	position: relative;
	padding: 7px 5px;
	height: 90px;
	display: flex;
	align-items: center;
}


h2 span, h1 span{
	display: flex;
	margin: 0 auto;
	align-items: center;
}


h2 span:after, h1 span:after{
 position: absolute;
  content: " ";
  border-bottom: solid 1.8px #00aa84;
  bottom: 8px;
  left:4%;
  width: 88%;
}

h2 span:before, h1 span:before{
 position: absolute;
  content: " ";
  border-bottom: solid 1.8px #00aa84;
  top: 8px;
  left:8%; 
  width: 88%;
}

h2:before, h1:before{
	content: "";
	width: 68px;
	border-top: 90px solid #00aa84;
	border-right: 48px solid transparent;
	height: 0;
	box-sizing: border-box;
	top:0;
	left: 0;
	position: absolute;
}


h2:after, h1:after{
	content: "";
	width: 68px;
	border-bottom: 90px solid #00aa84;
	border-left: 48px solid transparent;
	height: 0;
	box-sizing: border-box;
	top:0;
	right: 0;
	position: absolute;
}


h3{
	background: #ecf4d8;
	font-size: 1.3rem;
	font-weight: bold;
	display: flex;
	align-items: center;
	border-width: 0 3px;
	border-color: #00aa84;
	margin-bottom: 1rem;
}

h3 .s1{
	border-right: 8px double #00aa84;
	padding: 10px;
}

.s2{
	padding-left: 10px;
}


.inner{
	margin:0 20px;
}

/*左右にパディング入れる*/
.pd{
	padding:0 10px;
}

/*「シルク印刷について===========================*/
h4{
	border-bottom: 2px solid #00ab86;
	font-size: 1.1rem;
	font-weight: bold;
	padding-bottom:5px;
	margin: 0 10px 0.5rem;
}

.silk-block{
	margin-bottom:1rem;
}

.silk-block2 p{
	padding:0 1.5rem;
	margin-bottom: 1rem;
}


/*about-design-sec 「デザインについて」==============*/
.design-ul{
	display: flex;
	justify-content: center;
	gap:5%;
	align-items: flex-end;
	margin-bottom: 2rem;
}

.design-ul2{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap:10px;
	align-items: stretch;
}

.ura-omote{
	display: flex;
	align-items: flex-end;
	gap:5px;
	font-size: 1.3rem;
	font-weight: bold;
}

.ura-omote:after{
	content: "";
	height: 1px;
	background: black;
	flex-grow: 1;
}

.omote{
	margin-bottom: 15px;
}


.about-design-bottom{
	display: flex;
	gap:12px;
	margin-bottom: 2rem;
}


/*table設定*/
.about-design-bottom table{
	border: 1px solid;
	width: 39%;
}

th, td{
	border: 1px solid;
	text-align: center;
	padding: 7px;
}

th{
	background: #ecf2c9;
}

/*table設定おわり*/

.about-design-bottom > div{
	background: #ecf2c9;
	width: 59%;
	padding: 10px;
}

.p-green{
	font-size: 1.3rem;
	font-weight: bold;
	color: #3b9738;
	margin-bottom: 1rem;
}

.p-red{
	font-size: 1.2rem;
	font-weight: bold;
	color: red;
	text-align: center;
}


/*クリックしたら下に沈むバナー*/
.banner-down {
	filter: drop-shadow(0px 5px 3px #aaaaaa);
	transition: .2s;
	margin-bottom: 1rem;
}

.banner-down:hover{
  filter: unset;
  transform: translateY(4px);
}

@media screen and (max-width: 863px){
	h2 span:after, h1 span:after{
  left:6.5%; 
  width: 83%;
}

h2 span:before, h1 span:before{
  left:10.5%; 
  width: 83%;
}
	
}

@media screen and (max-width: 768px){
	
	h2, h1{
		font-size: 2rem;
		background-size: 100% 70px;/*横が100%*/
	}
	
	.inner{
		margin:0 10px;
	}
}

@media screen and (max-width: 686px){
h2 span:after, h1 span:after{
  left:8%; 
  width: 80%;
}

h2 span:before, h1 span:before{
  left:12%; 
  width: 80%;
}
}

@media screen and (max-width: 605px){
	
h2:before, h1:before{
	content: "";
	width: 55px;
	border-right: 42px solid transparent;
}


h2:after, h1:after{
	content: "";
	width: 55px;
	border-left: 42px solid transparent;
}
	
/*「dtfプリントの特徴」*/
	.silk-block{
	margin-bottom: 1rem;
}
	
/*デザインについて========================*/
	
.design-ul{
	flex-direction: column;
	justify-content: center;
	gap:5%;
	align-items: center;
	margin-bottom: 2rem;
}
	
.about-design-bottom{
	flex-direction: column;
	gap:1rem;
	margin-bottom: 1.5rem;
}
	
/*table設定*/
.about-design-bottom table{
	width: 100%;
}

/*table設定おわり*/

.about-design-bottom > div{
	width: 100%;
	padding: 10px;
}
}

@media screen and (max-width: 532px){
	h2, h1{
		font-size: 1.3rem;
	}
}

@media screen and (max-width: 500px){
	
/*全体*/
	section{
	margin-bottom: 2rem;
}
	
 h2 span:after, h1 span:after{
  left:9%; 
  width: 72%;
}

h2 span:before, h1 span:before{
  left:18%; 
  width: 72%;
}
	
h3{
	font-size: 1.15rem;
}
}