@charset "utf-8";
/* CSS Document */
h1 {
  font-weight: 600;
  line-height: 1.6;
  color: #009FB8;
}
.top-image {
  max-width: 60%;
}
.effect {
  width: 80%;
  list-style: none;
  margin-top: 1em;
}
.effect li {
  width: 20%;
}
.text-top {
  font-size: 120%;
}
.article {
  border: 2px dashed #999;
  position: relative;
  margin-top: 1em;
}
.article h1 {
  text-align: center;
  position: absolute;
  font-weight: 500;
  right: 0;
  left: 0;
  top: -1em;
}
.article h1 span {
  padding: 0 2em;
  background: #FFF;
}
.article .inner {
  padding: 2em;
}
.article h2 {
  font-weight: 600;
  font-size: 2.3em;
}
.inner {
  border-bottom: 1px solid #999;
  margin-bottom: 2em;
}
.inner:last-of-type {
  border-bottom: none;
  margin-bottom: 0;
}
.balloon {
  width: 25%;
}
.inner ul {
  margin-right: 3em;
  font-size: 1.3em;
}
.inner h3 {
  position: relative;
  display: inline-block;
	font-size:2em;
	font-weight:700;
  margin: 0 0 1.5em 0;
  padding: 0.5em 1em;
  min-width: 120px;
  max-width: 100%;
  color: #009FB8;
  background: #FFF;
  border-top: solid 3px #fff;
  border-right: solid 3px #fff;
  border-left: solid 3px #009FB8;
  border-bottom: solid 3px #009FB8;
	border-radius:12px;
  box-sizing: border-box;
}
.inner h3:before {
  content: "";
  position: absolute;
  bottom: -24px;
  left: 50%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-top: 12px solid #FFF;
  z-index: 2;
}
.inner h3:after {
  content: "";
  position: absolute;
  bottom: -30px;
  left: 50%;
  margin-left: -17px;
  border: 14px solid transparent;
  border-top: 14px solid #009FB8;
  z-index: 1;
}
.spray{width:20%;}
.glass div{width:49%;}
.glass p{width:49%;}
@media screen and (max-width:767.98px){
	.top-image{max-width:100%;}
	h1{font-size:1.6em;}
	.effect{width:100%;padding:0;flex-wrap:wrap;}
	.effect li{width:49%;}
	.h1title{font-size:1.3rem;line-height:1}
	.article h1 span {
		width:80%;
	}
	.article h1.line2 span{padding:0;}
	.article h1.line2{margin-top:-0.4em;line-height:1}
	.h1title:before,.h1title:after{display:none;}
	.article .inner{padding:0 0 1em 0;}
	.article .inner:first-of-type{padding:2em 0 0;}
	.article h2{font-size:1.6em;}
	.balloon{width:40%; margin-right:0.5em;}
	.spray{width:15%;}
	.inner ul{margin-right:0;padding-left:1em;}
	.inner h3{font-size:1.5em;}
	.glass div{width:100%;}
	.glass p{width:100%;}
}
