@font-face {
font-family: Corporate-Logo-Bold-ver2;
src: url("font/Corporate-Logo-Bold-ver2.ttf")
}
@font-face {
font-family: apt;
src: url("font/apt.ttf")
}

* {
  margin: 0;
}

 /***** ハンバーガー *****/
  .sp-nav-btn, .sp-nav {
    display: block;
  }
  .pc-nav {
    display: none;
  }
  .under-line {
    border-bottom: solid 10px yellow;
    font-size: 25px;
    line-height: 1.2;
  }
  /* ハンバーガーボタンの中身 */
  .sp-nav-btn {
    position: relative;
    width: 25px;
    height: 16px;
    margin: 5% 0 7% 0;
    z-index: 20;
    margin-left: auto;
    cursor: pointer;
  }
  /* ハンバーガーボタンの中身 */
  /* ハンバーガーボタンの背景色 */
  .sp-nav-btn:before {
    content: "menu";
    position: absolute;
    color: #142B34;
    width: 45px;
    height: 40px;
    font-size: 10px;
    top: -48px;
    right: 3px;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    padding-bottom: 0px;
    padding-top: 45px;
  }
  /* ハンバーガーボタンの背景色 */
  .pc-nav ul, .btn-wrapper {
    display: none;
  }
  /* ハンバーガーの３本線 */
  .sp-nav-btn span {
    display: block;
    width: 100%;
    height: 2px;
    background-color: #fff;
    position: absolute;
    transition: ease-in .3s;
  }
  .sp-nav-btn span:nth-of-type(1) {
    top: 0;
    right: 12px;
  }
  .sp-nav-btn span:nth-of-type(2) {
    top: 0;
    bottom: 0;
    margin: auto;
    right: 12px;
  }
  .sp-nav-btn span:nth-of-type(3) {
    bottom: 0;
    right: 12px;
  }
  /* ハンバーガーの３本線 */
  /* ハンバーガークリック後の線の動き */
  .sp-nav-btn.active span:nth-of-type(1) {
    transform: translateY(10px) rotate(-45deg);
    transition: ease-in .3s;
  }
  .sp-nav-btn.active span:nth-of-type(2) {
    opacity: 0;
    transition: ease-in .3s;
  }
  .sp-nav-btn.active span:nth-of-type(3) {
    transform: translateY(-4px) rotate(45deg);
    transition: ease-in .3s;
  }
  .sp-nav-btn.active:before {
    opacity: 0;
    transition: ease-in .3s;
  }
  /* ハンバーガークリック後の線の動き */
  /* ハンバーガークリック後のメニュー */
  .sp-nav {
    display: block;
    position: fixed;
    z-index: 10;
    top: 0;
    right: 0;
    width: 100vw;
    height: 100vh;
    transform: translateX(100vw);
    transition: ease-in 0.3s;
    background: #4799b7;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#81d8d0", endColorstr="#2dccd3", GradientType=1);
  }
  /* ハンバーガークリック後のメニュー */
  .sp-nav.active {
    transform: translateX(0);
  }
  /* ハンバーガークリック後メニュー中身 */
  .sp-nav ul {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 87vw
    height: 96vh;
  }
  .sp-nav ul li {
    font-size: 16px;
    font-size: 1rem;
    text-align: center;
    padding-top: 5px;
    list-style: none;
  }
  .sp-nav ul li a {
    color: #fff;
  }
  .sp-btn-wrapper {
    height: 50px;
    line-height: 50px;
  }

/*index*/
.box-beige {
    background: #e6e5d7;
    padding: 20px 0 40px 0;
}
.top-title {
    width: 100%;
    margin: 0 auto;
    font-size: 15px;
    font-weight: 300;
    color: #fff;
    text-align: center;
    background: #2C5F71;
    padding: 10px 0 10px 0;
}

.top-title h1 {
    font-size: 14px;
    font-weight: normal;
    color: #1f1f1f;
    top: 10px;
    left: auto;
    right: auto;
    position: absolute;
    z-index: 300;
 }
.top-title-b h1 {
  font-size: 50px;
  color: #4799b7;
  font-family: "Corporate-Logo-Bold-ver2";
}
.top-title-b h1 span {
  font-size: 40px;
  color: #393524;
  font-family: "Corporate-Logo-Bold-ver2";
}
.top-title-b h2 {
    font-size: 40px;
    color: #4799b7;
    font-family: "Corporate-Logo-Bold-ver2";
    line-height: 1.1;
}
.top-title-b h2 span {
  font-size: 40px;
  color: #393524;
  font-family: "Corporate-Logo-Bold-ver2";
}
.top-title-b h2 img {
    width: 80px;
    position: relative;
    left: 20px;
    top: 6px;
}
.top-title-b p {
    width: 500px;
    font-size: 12px;
    margin: 0 auto;
    padding: 20px;
}
.top-title-c h2 {
  font-size: 50px;
  color: #4799b7;
  font-family: "Corporate-Logo-Bold-ver2";
  line-height: 1.3;
}
.top-title-c h2 span {
  font-size: 40px;
  color: #393524;
  font-family: "Corporate-Logo-Bold-ver2";
}
.top-title-c h2 img {
    width: 80px;
    position: relative;
    left: 0px;
    top: 6px;
}
.top-title-d {
    background: #e6e5d7;
    margin: 50px 0 0 0;
}
.top-title-d h2 {
  font-size: 50px;
  color: #4799b7;
  font-family: "Corporate-Logo-Bold-ver2";
}
.top-title-d h2 span {
  font-size: 40px;
  color: #393524;
  font-family: "Corporate-Logo-Bold-ver2";
}
.top-title-d h2 img {
    width: 80px;
    position: relative;
    left: 20px;
    top: 20px;
    animation: pururun 1.2s linear 0.2s 1;
    animation-iteration-count: infinite;
}
@keyframes pururun {
  0%   { transform: scale(1.0, 1.0) translate(0%, 0%); }
  10%  { transform: scale(1.0, 1.0) translate(10%, 0%) skew(-10deg, 0deg); }
  60%  { transform: scale(1.0, 1.0) translate(20%, 0%) skew(-20deg, 0deg); }
  70%  { transform: scale(1.0, 1.0) translate(-15%, 0%) skew(15deg, 0deg); }
  80%  { transform: scale(1.0, 1.0) translate(15%, 0%) skew(-15deg, 0deg); }
  80%  { transform: scale(1.0, 1.0) translate(5%, 0%) skew(-5deg, 0deg); }
  90%  { transform: scale(1.0, 1.0) translate(-5%, 0%) skew(5deg, 0deg); }
  100% { transform: scale(1.0, 1.0) translate(0%, 0%); }
}
.top-photo {
  position: relative;
  z-index: -1;
}
.top-photo img {
  width: 100%;
  display: block;
  margin: 0 auto;
  margin-top: -70px;
  margin-bottom: 20px;
}
.box-four {
    width: 1300px;
    margin: 0 auto;
}
.box-four img:hover {
    opacity: .7;
}
.box-four img {
    width: 280px;
    float: left;
    padding: 15px;
    animation: puyon 1.0s linear 0s 1;
    animation-iteration-count: infinite;
}

@keyframes puyon {
  0%   { transform: scale(1.0, 1.0) translate(0%, 0%); }
  40%  { transform: scale(0.99, 1.0) translate(0%, -10%); }
  50%  { transform: scale(1.1, 1.0) translate(0%, 5%); }
  60%  { transform: scale(0.99, 1.02) translate(0%, -3%); }
  70%  { transform: scale(1.05, 0.95) translate(0%, 3%); }
  80%  { transform: scale(1.0, 1.0) translate(0%, 0%); }
  100% { transform: scale(1.0, 1.0) translate(0%, 0%); }
}

.box-two {
    width: 1200px;
    margin: 0 auto;
    margin-top: 40px;
}
.box-two img {
    width: 600px;
    float: left;
}
.box-two p {
    font-size: 18px;
    line-height: 1.5;
    color: #383838;
    width: 570px;
    float: left;
    padding: 10px 0 0 15px;
    text-align: justify;
}
.box-two-b {
    width: 1200px;
    margin: 0 auto;
    margin-top: 40px;
}
.box-two-b img {
    width: 600px;
    float: left;
}
.box-two-b p {
    font-size: 18px;
    line-height: 1.4;
    color: #383838;
    width: 570px;
    float: left;
    padding: 0 15px 0 0;
    text-align: justify;
    text-justify: inter-ideograph;
}
.box-twelve {
    width: 100%;
}

.box-twelve-a {
    width: 25%;
    height: 200px;
    background: #ffe4b5;
    padding: 0px;
    display: inline-block;
    float: left;
}
.box-twelve-a img {
    width: 25%;
    padding: 20px 0 0 0;
}
.box-twelve-a:hover {
    animation: purupuru 0.8s linear 0s 1;
    background: #ffd387;
}
.box-twelve-b:hover {
    animation: purupuru 0.8s linear 0s 1;
    background: #f64531;
}
.box-twelve-c:hover {
    animation: purupuru 0.8s linear 0s 1;
    background: #55bcc9;
}
@keyframes purupuru {
  0%   { transform: scale(1.0, 1.0) translate(0%, 0%); }
  20%  { transform: scale(1.0, 1.06) translate(-5%, -4%) skew(6deg, 0deg); }
  50%  { transform: scale(1.0, 0.94) translate(5%, 4%) skew(-6deg, 0deg); }
  65%  { transform: scale(1.0, 1.03) translate(2%, -2%) skew(-3deg, 0deg); }
  80%  { transform: scale(1.0, 0.97) translate(-2%, 2%) skew(3deg, 0deg); }
  100% { transform: scale(1.0, 1.0) translate(0%, 0%); }
}
.box-twelve-a h3 {
    color: #262626;
    padding: 0 0 0 0;
}
.box-twelve-a p {
    color: #262626;
    padding: 0 0 20px 0;
}
.box-twelve-b {
    width: 25%;
    height: 200px;
    background: #f86453;
    padding: 0px;
    display: inline-block;
    float: left;
}
.box-twelve-b img {
    width: 25%;
    padding: 20px 0 0 0;
}
.box-twelve-b h3 {
    color: #fff;
    padding: 0 0 0 0;
}
.box-twelve-b p {
    color: #fff;
    padding: 0 0 20px 0;
}
.box-twelve-c {
    width: 25%;
    height: 200px;
    background: #b0e0e6;
    padding: 0px;
    display: inline-block;
    float: left;
}
.box-twelve-c img {
    width: 25%;
    padding: 20px 0 0 0;
}
.box-twelve-c h3 {
    color: #262626;
    padding: 0 0 0 0;
}
.box-twelve-c p {
    color: #262626;
    padding: 0 0 20px 0;
}
.zoom-icon img {
    width: 100px;
    position: fixed;
    z-index: 500;
    left: 10px;
    top: 77%;
    opacity: .8;
    animation: purun 1.3s linear 0s 2;
    animation-iteration-count: infinite;
}
@keyframes purun {
  0%   { transform: scale(1.0, 1.0) translate(0%, 0%); }
  15%  { transform: scale(1.0, 1.0) translate(0%, 5%); }
  30%  { transform: scale(1.0, 1.0) translate(0%, 5%); }
  50%  { transform: scale(1.0, 1.0) translate(0%, 0%); }
  70%  { transform: scale(1.0, 1.0) translate(0%, 5%); }
  100% { transform: scale(1.0, 1.0) translate(0%, 0%); }
}

.contact {
    background: #f86453;
    width: 600px;
    margin: 30px auto;
    border-radius: 50px;
}
.contact p {
    font-size: 25px;
    font-weight: bold;
    color: #fff;
    padding: 10px 0 20px 10px;
    display: inline-block;
    vertical-align: 3px;
}
.contact img {
    width: 35px;
    display: inline-block;
    padding: 30px 0 0 0;
}
.contact:hover {
    background: #f52209;
}
.contact-all {
    background: #f86453;
    width: 600px;
    margin: 30px auto;
    border-radius: 50px;
}
.contact-all p {
    font-size: 25px;
    font-weight: bold;
    color: #fff;
    padding: 10px 0 20px 10px;
    display: inline-block;
    vertical-align: 3px;
}
.contact-all img {
    width: 35px;
    display: inline-block;
    padding: 30px 0 0 0;
}
.contact-all:hover {
    background: #f52209;
}
.tel-under {
    font-size: 52px;
    font-weight: bold;
    color: #4799b7;
    text-align: center;
    margin: 60px 0 10px 0;
    line-height: 0.6;
}
.tel-under span {
    font-size: 15px;
    font-weight: normal;
    color: #151c1f;
    text-align: center;
} 
.sns-method {
    width: 1200px;
    margin: 0 auto;
}

.method-naka {
    width: 380px;
    height: 117px;
    background: #00bfff;
    padding: 0px;
    display: inline-block;
    float: left;
    margin: 10px;
    border-radius: 10px;
}
.method-naka:hover {
    background: #00ace6;
}
.method-naka h3 {
    color: #fff;
    padding: 0 0 0 0;
    font-size: 25px;
}
.method-naka p {
    color: #fff;
    padding: 0 0 20px 0;
}
.method-naka-b {
    width: 380px;
    height: 117px;
    background: #32cd32;
    padding: 0px;
    display: inline-block;
    float: left;
    margin: 10px;
    border-radius: 10px;
}
.method-naka-b:hover {
    background: #43ac29;
}
.method-naka-b h3 {
    color: #fff;
    padding: 0 0 0 0;
    font-size: 25px;
}
.method-naka-b p {
    color: #fff;
    padding: 0 0 20px 0;
}
.method-naka-c {
    width: 380px;
    height: 117px;
    background: #f85441;
    padding: 0px;
    display: inline-block;
    float: left;
    margin: 10px;
    border-radius: 10px;
}
.method-naka-c:hover {
    background: #f62b14;
}
.method-naka-c h3 {
    color: #fff;
    padding: 0 0 0 0;
    font-size: 25px;
}
.method-naka-c p {
    color: #fff;
    padding: 0 0 20px 0;
}
.coverage img {
    margin: 0 auto;
    width: 800px;
    padding: 20px;
}

/*index*/

/*company*/
.company table {
	width: 750px;
	border: 1px solid #515151;
	padding: 20px;
	margin: 0 auto;
	text-align: left;
	color: #262626;
	font-size: 17px;
	border-collapse: collapse;
}
.company table th{
	border: 1px dotted #515151;
	padding: 20px;
	background: #E1E1E1;
}
.company table td{
	border: 1px dotted #515151;
	padding: 20px;	
	color: #262626;
	text-decoration: none;
}
/*company*/

/*アイテム*/
.point {
    background: #4799b7;
    width: 600px;
    margin: 30px auto;
    border-radius: 50px;
}
.point h2 {
    font-size: 25px;
    font-weight: 500;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    color: #ECE312;
    padding: 15px;
    display: inline-block;
    vertical-align: 3px;
}
.point p {
    font-size: 25px;
    font-weight: bold;
    color: #fff;
    padding: 10px 0 20px 10px;
    display: inline-block;
    vertical-align: 3px;
}
.point img {
    width: 35px;
    display: inline-block;
    padding: 30px 0 0 0;
}
.item-zu img {
    width: 600px;
    margin: 0 auto;
}
/*アイテム*/

/*ホームページ*/
.box-web {
    background-color: #3b7F98;
    padding: 26px;
    width: 1146px;
    margin: 0px auto;
}
.box-web h2 {
 color: #fff;
 font-size: 32px;
 font-weight: 600;
 font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
 line-height: 0.3;
 margin-top: 16px;
}
.box-web p {
 color: #fff;
 font-size: 18px;
 font-weight: 600;
 font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
 line-height: 1.0;
}
.box-web span {
 color: #fff;
 font-size: 17px;
 font-weight: 220;
 font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
}
.box-three {
    width: 1200px;
    margin: 0 auto;
}
.box-three img {
    width: 350px;
    float: left;
    padding: 15px;
    animation: puyon 1.0s linear 0s 1;
    animation-iteration-count: infinite;
}
.web-point {
    width: 1200px;
    padding: 30px;
    margin: 0 auto;
}
.web-point h2 {
    font-size: 40px;
    color: #4799b7;
    font-family: "Corporate-Logo-Bold-ver2";
}
.web-point table {
    width: 400px;
    border-collapse: collapse;
    float: left;
}
.web-point table th,td {
    border: 0.5px solid #696969;
}
.web-point table th {
    font-size: 25px;
    color: #fff;
    padding: 12px 15px;
    background: #77b4ca;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-weight: 400;
}
.web-point table td {
    font-size: 18px;
    color: #303030;
    padding: 12px 10px;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-weight: normal;
}
.web-point table td span {
    font-size: 31px;
    color: #4596B3;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-weight: bold;
}
/*ホームページ*/

/*ポスティング*/
.sokyu-waku {
    width: 1000px;
    margin: 0 auto;
}
.sokyu-waku h1 {
  font-size: 50px;
  color: #4799b7;
  font-family: "Corporate-Logo-Bold-ver2";
}
.sokyu-waku h1 span {
  font-size: 40px;
  color: #393524;
  font-family: "Corporate-Logo-Bold-ver2";
}
.sokyu-waku-left {
    width: 500px;
    height: 350px;
    background: #ffe4b5;
    float: left;
}
.sokyu-waku-left h2 {
    padding: 10px 0 0 0;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-size: 45px;
    color: #f86453;
}
.sokyu-waku-left p {
    padding: 10px 30px 0 30px;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-size: 18px;
    color: #262626;
    text-align: left;
}
.sokyu-waku-right {
    width: 500px;
    height: 350px;
    background: #f86453;
    float: left;  
}
.sokyu-waku-right h2 {
    padding:  10px 0 0 0;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-size: 45px;
    color: #fff;
}
.sokyu-waku-right p {
    padding: 10px 30px 0 30px;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-size: 18px;
    color: #fff;
    text-align: left;
}
/*ポスティング*/

/*Blog*/
.news {
	margin: auto;
	width: 700px;
	height: 350px;
	overflow: auto;
	color: #696969;
	font-size: 14px;
    text-align: left;
}
/*Blog*/

/*LINEスタンプ*/
.box-four-b {
    width: 1000px;
    margin: 0 auto;
}
.box-four-b img:hover {
    opacity: .7;
}
.box-four-b img {
    width: 180px;
    float: left;
    padding: 30px;
}
/*LINEスタンプ*/

/*SNSお問合せ方法*/
.method-phot img {
    width: 1000px;
    margin: 0 auto;
}
/*SNSお問合せ方法*/

/*上に*/
#pageTop {
  position: fixed;
  bottom: 70px;
  right: 20px;
}
#pageTop a span {
  font-size: 14px;
  font-weight: normal;
  margin: -4px 0px 0px 0px;
  display: block;
  line-height: 1.1em;
}
#pageTop a {
  display: block;
  z-index: 999;
  padding: 8px 10px 10px 10px;
  border-radius: 30px;
  width: 55px;
  height: 55px;
  background-color: #3b7F98;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
}
#pageTop a:hover {
  text-decoration: none;
  opacity: 0.7;
}
/*上に*/
.fadein {
  opacity: 0;
  transform: translate(0, 30px);
  transition: all 0.5s ease;
}
.fadein.scrollin {
  opacity: 1;
  transform: translate(0, 0);
}
.fadein2 {
  opacity: 0;
  transform: translate(0, 40px);
  transition: all 1.5s ease;
}
.fadein2.scrollin {
  opacity: 1;
  transform: translate(0, 0);
}
.fadein3 {
  opacity: 0;
  transform: translate(0, 50px);
  transition: all 2.5s ease;
}
.fadein3.scrollin {
  opacity: 1;
  transform: translate(0, 0);
}
.fadein4 {
  opacity: 0;
  transform: translate(0, 60px);
  transition: all 3.5s ease;
}
.fadein4.scrollin {
  opacity: 1;
  transform: translate(0, 0);
}
h1 a {
  color: #fff;
}
h2 {
  font-size: 22px;
  color: #4B452D;
  font-family: "Corporate-Logo-Bold-ver2";
}
p {
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  font-size: 15px;
  color: #606060;
}
nav {
  clear: both;
  padding: 10px;
}
a {
  text-decoration: none;
}
.hr-tensen {
    border: dotted 0.5px #696969;
}
.menu {
  text-align: center;
  margin-top: -10px;
  margin-bottom: 10px;
}
.menu ul li {
  display: inline-block;
}
.menu ul li a {
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  font-size: 15px;
  text-decoration: none;
  border-left: dotted 1px #fff;
  padding: 10px 15px;
  font-family: "NotoSansJP-Regular";
}

/* メニュー画像アコーディオン */
#popup {
  width: 100%;
  min-width: 900px;
  line-height: 10px;
  background: #fff;
  padding: 4% 1%;
  box-sizing: border-box;
  display: none;
  position: fixed;
  top: 38%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  opacity: 0.99;
  animation: fadeIn 0.7s ease 0s 1 normal;
  -webkit-animation: fadeIn 0.7s ease 0s 1 normal;
}
@keyframes fadeIn { /*上のbody内で呼び出しているアニメーションと名前をそろえる*/
  0% {
    opacity: 0
  } /* 始め */
  100% {
    opacity: 1
  } /* 終わり */
}
label img {
  width: 230PX;
  padding: 1px;
}
label {
  display: block;
}
label span {
  border-left: dotted 1px #fff;
  display: block;
  color: #fff;
  font-size: 15px;
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  font-weight: bold;
  text-align: center;
  padding: 10px 15px;
}
label span:hover {
  cursor: pointer;
  opacity: 0.7;
}
input[type="checkbox"] {
  display: none;
}
input[type="checkbox"]:checked + #popup {
  display: block;
  transition: .2s;
}
/* メニュー画像アコーディオン */
header {
  position: fixed;
  width: 100%;
  z-index: 100;
}

.header-wrapper.addColor {
  background: #4799B7;
  transition: ease-in 0.3s;
}
.header-wrapper-top {
  display: flex;
  align-items: center;
  padding: 1% 3vw;
  transition: ease-in 0.3s;
  background: #4799B7;
  min-width: 90%;
  width: 90%;
  margin: 0 auto;
  border-radius: 100px;
  margin-top: 12px;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2dccd3", endColorstr="#81d8d0", GradientType=1);
}
.header-wrapper-top.addColor {
  background: #4799B7;
  transition: ease-in 0.3s;
}
.pc-nav a {
  text-shadow: 2px 2px 4px rgba(17, 17, 144, 0.2);
}
.pc-nav ul, .btn-wrapper {
  line-height: 24px;
}
.sp-nav-btn, .sp-nav {
  display: block;
}
.btn-wrapper {
  transition: all 0.3s;
  border-radius: 50px;
}
.button:hover {
  background: #fff;
  color: #000858;
}
.pc-nav ul li, .button {
  display: inline-block;
  vertical-align: middle;
  padding: 0 7px;
}
.chara {
    width: 50px;
}
.logo {
    width: 200px;
    padding: 15px;
}
.pc-nav {
  margin-left: auto;
}

.hover-under-line {
    padding: 0.5em 1em;
    text-decoration: none;
    border-left: none;
}
.hover-under-line a img {
  display: inline-block;
  width: 30px;
  padding: 0px 5px 0px 0px;
  vertical-align: -6px;
    }
.hover-under a {
  position: relative;
  display: inline-block;
  margin: 4px 0;
  font-size: 15px;
  color: #fff;
  text-decoration: none;
  font-family:"Lucida Sans Unicode", "Lucida Grande", "sans-serif";
}
.hover-under a span {
  font-size: 25px;
  font-weight: bold;
  color: #fff;
  text-decoration: none;
  font-family:"Lucida Sans Unicode", "Lucida Grande", "sans-serif";
}
.menu-button {
  background: #fff;
  border-radius: 50px;
  color: #4799b7;
  padding: 10px 15px;
  font-size: 15px;
  font-weight: bold;
 }
.menu-button-line {
  padding: 0px 0px;
  width: 50px;
}
.pc-button-line a img {
  display: inline-block;
  width: 25px;
  padding: 5px 0px 0px 8px;
  vertical-align: 0px;
}
.pc-button-line a img:hover {
  animation: r7 2s linear infinite;
  opacity: .7;
}
.credit-style-yoko img {
    width: 155px;
    margin-top: 4px;
}
.credit-style img {
    width: 215px;
    margin-top: 4px;
}
 
@keyframes r7 {
  0%   { transform: rotateY(0deg); }
  100% { transform: rotateY(360deg); }
}
.open-time p {
    font-size: 14px;
    font-weight: normal;
    color: #fff;
    line-height: 1.5;
    text-align: right;
}

.site-logo {
  width: 100%;
  height: 250px;
  font-size: 20px;
  color: #fff;
}
.site-logo-txt {
  padding-left: 10px;
}
.h-title h2 {
  font-size: 13px;
  color: #fff;
  padding: 10px;
  line-height: 1.2;
  float: left;
}
.h-title img {
  width: 45px;
  color: #fff;
  padding: 15px;
}
.title-app h1 span{
  font-family: "Corporate-Logo-Bold-ver2";
  font-size: 78px;
  color: #4799B7;
  line-height: 1.5;
}
.title-app h1 {
  font-family: "Corporate-Logo-Bold-ver2";
  font-size: 36px;
  color: #262626;
}
.title-app h2 span{
  font-family: "Corporate-Logo-Bold-ver2";
  font-size: 58px;
  color: #4799B7;
  line-height: 1.5;
}
.title-app h2 {
  font-family: "Corporate-Logo-Bold-ver2";
  font-size: 36px;
  color: #262626;
}
.title-app p {
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  font-size: 16px;
  color: #414141;
  width: 900px;
  margin: 0 auto;
  text-align: left;
  text-align: justify;
  text-justify: inter-ideograph;
}
.title-chui p {
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  font-size: 16px;
  color: #414141;
  width: 900px;
  margin: 0 auto;
  text-align: left;
  text-align: justify;
  text-justify: inter-ideograph;
  padding: 20px;
}

.app-back {
    background: #f0f8ff;
    padding: 40px;
    margin-top: -20px;
}
.app-kinou {
    background: #E6E5D7;
}
.app-kinou img {
    width: 1000px;
    margin: 0 auto;
    padding: 20px;
}
.app-box {
    width: 950px;
    margin: 0 auto;
}
.app-box img {
    width: 250px;
    float: left;
}

.app-box-font span {
  font-family: "Corporate-Logo-Bold-ver2";
  font-size: 58px;
  color: #4799B7;
  line-height: 1.5;
}
.app-box-font p {
  font-family: "Corporate-Logo-Bold-ver2";
  font-size: 36px;
  color: #262626;
  text-align: left;
}
.app-box-font h2 {
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  font-size: 16px;
  font-weight: normal;
  color: #414141;
  width: 900px;
  margin: 0 auto;
  text-align: left;
  text-align: justify;
  text-justify: inter-ideograph;
  line-height: 2;
}
.app-box-r {
    width: 950px;
    margin: 0 auto;
}
.app-box-r img {
    width: 180px;
    float: right;
}
.app-box-font-r {
    float: left;
    width: 730px;
}
.app-box-font-r span {
  font-family: "Corporate-Logo-Bold-ver2";
  font-size: 58px;
  text-align: left;
  color: #4799B7;
  line-height: 1.5;
  width: 730px;
}
.app-box-font-r p {
  font-family: "Corporate-Logo-Bold-ver2";
  font-size: 36px;
  color: #262626;
  text-align: left;
  width: 730px;
}
.app-box-font-r h2 {
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  font-size: 16px;
  font-weight: normal;
  color: #414141;
  width: 690px;
  margin: 0 auto;
  text-align: left;
  text-align: justify;
  text-justify: inter-ideograph;
  line-height: 2;
}
.app-box-five-soto {
    width: 950px;
    margin: 0 auto;
}
.app-box-five {
    float: left;
    width: 20%;
}
.app-box-five img {
    width: 90%;
}
.app-box-five p {
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  font-size: 14px;
  color: #262626;
  text-align: center;
}
.clear {
    float: clear;
}
.style-logo-b {
  width: 250px;
  margin: 0 auto;
  margin-top: -30px;
  display: block;
  padding: 30px;
}
.style-logo {
  float: left;
  width: 300px;
  padding: 10px;
}
.mail-style {
  float: right;
  width: 52px;
  padding: 10px;
}
.style-mail {
  margin: right;
  width: 160px;
  position: absolute;
  top: -16px;
  right: 0;
  padding: 15px;
}
.tel-fax {
  display: inline-block;
  padding: 15px;
  float: right;
}
.tel-fax img {
  display: inline-block;
  width: 30px;
}
.tel-fax p {
  display: inline-block;
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
  color: #fff;
  font-size: 28px;
  font-weight: bold;
  text-decoration: none;
}
.tel-fax span {
  display: block;
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
  color: #fff;
  font-size: 15px;
}
.sns {
  display: inline-block;
  padding: 15px;
  float: right;
}
.sns img {
  display: inline-block;
  width: 65px;
}
main {
  text-align: center;
}
.all-box {
  max-width: 1000px;
  margin: 0 auto;
}
.top-line {
  background: #0abab5;
  height: 35px;
}
.top-line-b {
  background: #0abab5;
  height: 115px;
  margin-top: -30px;
}
.top-line-b p {
  font-size: 15px;
  color: #fff;
  text-align: center;
  padding: 25px;
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}
.top-line-c {
  background: #0abab5;
  height: 30px;
  margin-top: -30px;
}
.top-line-c p {
  font-size: 17px;
  color: #fff;
  text-align: center;
  padding: 25px;
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}
.top-style {
  background: #DAFDFC;
  margin: 0 auto;
  width: 100%;
  height: 785px;
}
.top-font-line {
  float: left;
  font-size: 13px;
  width: 1000px;
  margin-left: 13%;
}
.top-font-line p {
  padding: 7px;
  color: #ffffff;
}
.top-font p {
  font-family: "NotoSansJP-Black";
  font-size: 150px;
  opacity: 0.6;
  color: #0BD6D0;
  text-align: left;
  transform: rotate(-5deg);
  width: 95%;
  margin: -600px 0px 0px 0px;
  line-height: 150px;
}

.top-photo-app img {
  width: 100%;
  display: block;
  margin: 0 auto;
  margin-top: 0px;
  margin-bottom: 20px;
}
.top-photo-all{
  position: relative;
  z-index: -1;   
}
.top-photo-all img {
  width: 100%;
  display: block;
  margin: 0 auto;
  margin-top: 0px;
  margin-bottom: 20px;
}
.smafo-sokyu p {
  width: 100%;
  text-align: center;
  padding: 0px;
  font-size: 17px;
  font-family: "FLOPDesignFont";
  font-weight: bold;
  color: #4B452D;
}
.smafo-sokyu p span {
  font-size: 22px;
  font-family: "FLOPDesignFont";
  color: #4799B7;
}
.smafo-sokyu-b img {
  max-width: 1000px;
  margin: 0 auto;
  display: block;
}
.smafo-sokyu-b p {
  width: 950px;
  text-align: center;
  padding: 20px;
  font-size: 45px;
  font-family: "OverpassMono-Bold";
  font-weight: bold;
  color: #696969;
}
.smafo-sokyu-b p span {
  font-size: 60px;
  font-family: "corp_round_v1";
  color: #0abab5;
}
.company-name p {
  font-family: "FLOPDesignFont";
  font-size: 40px;
  font-weight: bold;
  text-align: center;
  padding: 5px 7px;
  margin: 30px auto 20px;
  display: block;
}
.company-name {
  border-bottom: solid 3px skyblue;
  position: relative;
  margin: auto;
  display: block;
  margin-top: -50px;
}
.company-name:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #FFD40B;
  bottom: -3px;
  width: 30%;
}
.company-name-b p {
  font-family: "OverpassMono-Bold";
  font-size: 45px;
  font-weight: bold;
  text-align: center;
  padding: 5px 7px;
  margin: 30px auto 20px;
  display: block;
}
.company-name-b p span {
  font-family: "OverpassMono-Bold";
  font-size: 70px;
  font-weight: bold;
  color: #0abab5;
}
.company-name-c p {
  font-family: "OverpassMono-Bold";
  font-size: 45px;
  font-weight: bold;
  text-align: center;
  padding: 5px 7px;
  margin: 30px auto 20px;
  display: block;
}
.company-name-c {
  border-bottom: solid 3px skyblue;
  position: relative;
  margin: auto;
  display: block;
  width: 50%;
}
.company-name-c:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #FFD40B;
  bottom: -3px;
  width: 30%;
}
.comment {
  width: 650px;
  text-align: left;
  text-align: justify;
  margin: 0 auto;
  float: left;
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}
.comment-g {
  width: 500px;
  text-align: left;
  text-align: justify;
  margin: 0 auto;
  float: left;
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}
.chara-blue img {
  width: 260px;
  padding: 20px;
  float: right;
  margin-top: -50px;
  z-index: 800;
  position: relative;
}
.comment-r {
  width: 500px;
  text-align: left;
  text-align: justify;
  margin: 0 auto;
  float: right;
  margin-top: 30px;
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}
.chara-orange-top img {
  width: 450px;
  padding: 20px;
  float: right;
  margin-top: -12px;
  z-index: 800;
  position: relative;
}
.chara-orange img {
  width: 250px;
  padding: 20px;
  float: left;
  margin-top: -100px;
  z-index: 200;
  position: relative;
}
.chara-orange-b img {
  width: 250px;
  padding: 20px;
  float: left;
  margin-top: -100px;
  z-index: 200;
  position: relative;
}
.chara-orange-c img {
  width: 250px;
  padding: 20px;
  float: left;
  margin-top: -100px;
  z-index: 200;
  position: relative;
}
.comment-o {
  width: 700px;
  text-align: left;
  text-align: justify;
  margin: 0 auto;
  float: right;
  margin-top: 30px;
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}
.chara-cha img {
  width: 450px;
  padding: 20px;
  float: left;
  margin-top: 20px;
  z-index: 200;
  position: relative;
}
.comment-c {
  width: 1000px;
  margin: 0 auto;
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}
.comment-d {
  width: 1000px;
  text-align: center;
  margin: 0 auto;
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}
.comment-e {
  width: 800px;
  margin: 0 auto;
  text-align: left;
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}
.comment-e span {
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  font-size: 20px;
  font-weight: bold;
}
.flow img {
  width: 250px;
  padding: 20px;
  float: left;
  margin-top: 0px;
  z-index: 200;
  position: relative;
}
.comment-f {
  width: 700px;
  text-align: left;
  text-align: justify;
  margin: 0 auto;
  float: right;
  margin-top: 30px;
}
.comment-f p {
  font-size: 15px;
  color: #696969;
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}
.comment-f span {
  font-size: 28px;
  font-weight: bold;
  color: #0abab5;
  font-family: "FLOPDesignFont";
}
.clear {
  clear: both;
}
.price-box {
  width: 28%;
  padding: 15px;
  text-align: center;
  float: left;
  margin: 5px;
}
.price-box-ue p {
  color: #4799B7;
  font-size: 22px;
  font-weight: bold;
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
  line-height: 1.3;
}
.price-box-ue span {
  color: #696969;
  font-size: 13px;
  font-weight: bold;
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
  line-height: 1.3;
}
.price-box-ue img {
  height: 60px;
  padding: 10px;
}
.price-box-big {
  margin: 0 auto;
  color: #4799B7;
  font-size: 25px;
  font-weight: bold;
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
  line-height: 0.3;
}
.price-box-ue-b p {
  color: #4799B7;
  font-size: 16px;
  font-weight: bold;
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
  line-height: 1.3;
}
.price-box-naka-waku {
  background: #4799B7;
  color: #fff;
  font-size: 12px;
  font-weight: normal;
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
  width: 250px;
  padding: 5px 13px;
  border-radius: 15px;
}
.price-box-small-ll {
        width: 1000px;
        margin: 0 auto;
    }
  .price-box-small-ll p {
    padding: 15px;
    color: #696969;
    font-size: 13px;
    font-weight: normal;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    line-height: 1.5;
    text-align: left;
}
.puls img {
  margin: 0 auto;
  display: block;
  width: 100px;
  padding: 20px;
}
.kukan-style {
  margin-top: 250px;
}
.naka-obi {
  background: #DAFDFC;
  margin: 0 auto;
  width: 100%;
  height: 1670px;
}
.under-line {
  background: #4799b7;
  height: 280px;
  bottom: 0;
}
.under-line p {
  font-size: 13px;
  color: #fff;
  text-align: center;
  padding: 9px;
}
.under-line h4 {
   font-size: 20px;
   color: #fff;
   text-align: center;
   padding: 20px 0 0 0;
}
.under-line h4 span {
   font-size: 16px;
   font-weight: normal;
   color: #fff;
   text-align: center;
   padding: 15px 0 0 0;
}
.company table {
  width: 750px;
  border: 1px solid #515151;
  padding: 20px;
  margin: 0 auto;
  text-align: left;
  color: #262626;
  font-size: 17px;
  border-collapse: collapse;
}
.company table th {
  border: 1px dotted #515151;
  padding: 20px;
  background: #E1E1E1;
}
.company table td {
  border: 1px dotted #515151;
  padding: 20px;
  color: #262626;
  text-decoration: none;
}
.price-waku table {
  float: left;
  width: 50%;
  border: 1px solid #515151;
  margin: 5px;
  text-align: left;
  color: #262626;
  font-size: 17px;
  border-collapse: collapse;
}
.price-waku table th {
  border: 1px dotted #515151;
  padding: 7px 15px;
  background: #D5E7EE;
  font-size: 20px;
}
.price-waku table td {
  border: 1px dotted #515151;
  padding: 7px 20px;
  text-align: left;
  font-size: 18px;
  color: #696969;
}
.price-waku table td form {
  text-align: left;
  font-size: 15px;
  font-family: Meiryo, YuGothic, "Yu Gothic medium", "Hiragino Sans", "sans-serif";
  color: #262626;
  padding: 30px 10px;
}
.kaigyo-pac {
  background: #0abab5;
  border-radius: 20px;
  width: 320px;
  float: left;
}
.kaigyo-pac p {
  color: #fff;
  font-size: 15px;
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  text-align: center;
  padding: 10px 12px;
}
.kaigyo-pac p span {
  color: #fff;
  font-size: 30px;
  font-family: "corp_round_v1";
  text-align: center;
}
.tasu {
  float: left;
}
.tasu p {
  font-size: 80px;
  font-family: "corp_round_v1";
  color: #0abab5;
  padding: 10px;
}
.tasu p span {
  font-size: 40px;
  font-family: "corp_round_v1";
  color: #696969;
}
.tel-banner img {
  margin: 0 auto;
  margin-top: -90px;
  width: 900px;
  display: block;
  padding: 20px;
}
.button-style-all {
  background: #4799B7;
  width: 200px;
  margin: 0 auto;
  padding: 10px 12px;
  border-radius: 50px;
}
.button-style-all:hover {
  background: #6CAEC6;
}
.button-style-all a {
  text-decoration: none;
}
.button-style-all p {
  text-align: center;
  font-family: Meiryo, YuGothic, "Yu Gothic medium", "Hiragino Sans", "sans-serif";
  font-size: 16px;
  color: #fff;
  line-height: 1.2;
}
.button-style-all img {
  text-align: center;
  width: 14px;
  padding: 5px 0px 0px 0px;
}
.button-style {
  background: #4799B7;
  width: 60%;
  margin: 0 auto;
  padding: 10px 12px;
  border-radius: 50px;
}
.button-style:hover {
  background: #6CAEC6;
}
.button-style a {
  text-decoration: none;
}
.button-style p {
  text-align: center;
  font-family: Meiryo, YuGothic, "Yu Gothic medium", "Hiragino Sans", "sans-serif";
  font-size: 16px;
  color: #fff;
  line-height: 1.2;
}
.button-style-b {
  background: #0abab5;
  width: 160px;
  margin: 0 auto;
  padding: 5px 12px;
  border-radius: 20px;
}
.button-style-b:hover {
  background: #1AF2EC;
}
.button-style-b a {
  text-decoration: none;
}
.button-style-b p {
  text-align: center;
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  font-size: 14px;
  color: #fff;
}
.change_btn {
    position: relative;
    display: inline-block;
    font-weight: bold;
    padding: 0.25em 0.5em;
    text-decoration: none;
    color: #00BCD4;
    background: #ECECEC;
    transition: .4s;
  }

.change_btn:hover {
    background: #00bcd4;
    color: white;
}
.tate-line-q {
  border-left: thick solid #ADFAF8;
  padding-left: 10px;
}
.tate-line-q p {
  text-align: left;
  font-size: 19px;
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}
.tate-line-q p span {
  text-align: left;
  font-size: 30px;
  color: #ADFAF8;
  font-family: "NotoSansJP-Black";
}
.tate-line-a {
  border-left: thick solid #0abab5;
  padding-left: 10px;
}
.tate-line-a p {
  text-align: left;
  font-size: 19px;
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}
.tate-line-a p span {
  text-align: left;
  font-size: 30px;
  color: #0abab5;
  font-family: "NotoSansJP-Black";
}
.font-move {
  position: relative;
  max-width: 1000px;
  margin: 0 auto;
  margin-top: 80px;
  font-weight: bold;
}

obi-box {}
obi-box obi {
  position: absolute;
  left: 0;
  bottom: 0.2em;
  margin: 0;
  padding: 0;
  z-index: 0.5;
}
obi-box obi span {
  position: relative;
  color: #fff;
  font-family: "OverpassMono-Bold";
  padding: 10px 10px 7px 10px;
  font-size: 47px;
  line-height: 53px;
  letter-spacing: 0em;
  white-space: nowrap;
}
obi-box obi span::after {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  background: #0abab5;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  transition: 0.3s;
  transform-origin: left;
}
.font-move.motion span::after {
  -webkit-animation: shutter 0.5s ease 0s 1 alternate none;
  animation: shutter 0.5s ease 0s 1 alternate none;
}
@keyframes shutter {
  0% {
    -webkit-transform: scaleX(0);
    -ms-transform: scaleX(0);
    transform: scaleX(0);
  }
  100% {
    -webkit-transform: scaleX(1);
    -ms-transform: scaleX(1);
    transform: scaleX(1);
  }
}
.zoom {
  margin: 0 auto;
  max-width: 850px;
}
.zoom-photo {
  width: 400px;
  margin: 0 auto;
  overflow: hidden; /*非表示*/
  display: inline-block;
  padding: 10px;
}
.zoom-photo img {
  transition: 1s all;
  width: 400px;
}
.zoom-photo img:hover {
  transform: scale(1.05, 1.05);
}
.dott-line {
  width: 850px;
  border-top: 1px dashed#696969;
}
.blog {
  max-width: 900px;
  margin: 0 auto;
}
.blog-photo img {
  width: 400px;
  float: left;
  padding: 0px 20px 6px 0px;
}
.blog-photo p {
  font-size: 15px;
  text-align: left;
  color: #696969;
  padding: 10px;
  text-align: justify line-height: 0.9;
}
.blog-photo p span {
  font-size: 30px;
  font-weight: bold;
  text-align: left;
  color: #696969;
  font-family: "corp_round_v1";
  line-height: 0.5;
  margin-top: 1px;
  display: block;
}
.blog-date {
  background: #0abab5;
  width: 73px;
  height: 15px;
  font-size: 13px;
  text-align: left;
  color: #fff;
  display: block;
  padding: 18px;
  margin: 0 15px 15px 400px;
}
.blog-page {
  background: #fff;
  height: 30px;
  width: 30px;
  border: 1px solid #696969;
  margin: 0 auto;
  display: inline-block;
  margin: 20px;
}
.blog-page p {
  color: #696969;
  font-size: 20px;
}
.blog-page:hover {
  background: #696969;
}
.blog-page p:hover {
  color: #fff;
}
.works-style {
  margin: 0 auto;
  max-width: 900px;
  padding: 30px
}
.works-style p {
  text-align: left;
}
.works-style span {
  text-align: left;
  font-size: 30px;
  font-family: "NotoSansJP-Black";
  color: #696969;
  margin-bottom: 15px;
  display: block;
}
.item-box {
  width: 1100px;
  margin: 0 auto;
}
.item-box img {
  width: 30%;
  padding: 10px;
}
.size-tab table {
  margin: 0 auto;
}
.size-tab table td {
  width: 50px;
  height: 50px;
  vertical-align: center;
  padding: 7px;
}
.size-tab-b table {
  margin: 0 auto;
}
.size-tab-b table td {
  width: 150px;
  height: 50px;
  vertical-align: center;
  padding: 7px;
}

.box6 {
  padding: 1em 1em;
  margin: 0em 0;
  background: #fff;
  border: dashed 2px #00cccc; /*点線*/
}
.box6 p {
  font-size: 22px;
  margin: 0;
  padding: 0;
}
.menu-select {
}
.menu-select-naka {
  width: 130px;
  padding: 20px;
  margin: 20px auto;
  border: dashed 2px #00cccc; /*点線*/
  display: inline-block;
  background: #D2FFFF;
}
.menu-select-naka p {
  font-size: 18px;
  margin: 0;
  padding: 0;
  color: #00cccc;
}
.menu-select-naka span {
  font-size: 12px;
  margin: 0;
  padding: 0;
  color: #696969;
}
.menu-select-naka:hover {
  background: #86F5F5;
  color: #fff;
}

.mail-form {
    margin-top: 50px;
    text-align: center;
}
.mail-form iframe {
    width: 100%;
    height: 550px;
}
.mail-form-zoom {
    margin-top: 50px;
    text-align: center;
}
.mail-form-zoom iframe {
    width: 100%;
    height: 750px;
}
.privacy {
    width: 180px;
    font-size: 13px;
    background: #4799b7;
    border-radius: 30px;
    margin: 0 auto;
    padding: 10px 12px;
    color: #fff;
}

/*========= スクロールダウンのためのCSS ===============*/


/*=== 9-1-4 矢印が動いてスクロールを促す  ====*/

/*スクロールダウン全体の場所*/
.scrolldown4{
    /*描画位置※位置は適宜調整してください*/
  position:absolute;
  bottom:1%;
  right:50%;
    /*矢印の動き1秒かけて永遠にループ*/
  animation: arrowmove 1s ease-in-out infinite;
}

/*下からの距離が変化して全体が下→上→下に動く*/
@keyframes arrowmove{
      0%{bottom:1%;}
      50%{bottom:3%;}
     100%{bottom:1%;}
 }

/*Scrollテキストの描写*/
.scrolldown4 span{
    /*描画位置*/
  position: absolute;
  left:-28px;
  bottom:5px;
    /*テキストの形状*/
  color: #30a09c;
  font-size: 17px;
  font-weight: bold;
  letter-spacing: 0.05em;
  /*縦書き設定*/
  -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
}

/* 矢印の描写 */
.scrolldown4:before {
    content: "";
    /*描画位置*/
    position: absolute;
    bottom: 0;
    right: -6px;
    /*矢印の形状*/
    width: 1px;
    height: 20px;
    background: #30a09c;
    transform: skewX(-31deg);
}

.scrolldown4:after{
  content:"";
    /*描画位置*/
  position: absolute;
  bottom:0;
  right:0;
    /*矢印の形状*/
  width:1px;
  height: 65px;
  background: #30a09c;
}

/*========= スクロールダウンのためのCSS ===============*/


/*タブ切り替え全体のスタイル*/
.tab-box {
  margin-top: 50px;
  padding-bottom: 40px;
  background-color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  width: 1000px;
  margin: 0 auto;
}
/*タブのスタイル*/
.tab_item {
  width: calc(100%/3);
  height: 50px;
  border-bottom: 3px solid #4799B7;
  background-color: #d9d9d9;
  line-height: 50px;
  font-size: 16px;
  text-align: center;
  color: #565656;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
}
.tab_item:hover {
  opacity: 0.75;
}
/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}
/*タブ切り替えの中身のスタイル*/
.tab_content {
  display: none;
  padding: 40px 40px 0;
  clear: both;
  overflow: hidden;
}
/*選択されているタブのコンテンツのみを表示*/
#one:checked ~ #one_content, #two:checked ~ #two_content, #three:checked ~ #three_content {
  display: block;
}
/*選択されているタブのスタイルを変える*/
.tab-box input:checked + .tab_item {
  background-color: #4799B7;
  color: #fff;
}

    
/*index*/

.top-title {
    width: 100%;
    margin: 0 auto;
    font-size: 12px;
    font-weight: 300;
    color: #fff;
    text-align: center;
    background: #2C5F71;
    padding: 10px 0 10px 0;
}
.top-title-b h1 {
  font-size: 27px;
  color: #4799b7;
  font-family: "Corporate-Logo-Bold-ver2";
  line-height: 1.3;
}
.top-title-b h1 span {
  font-size: 19px;
  color: #393524;
  font-family: "Corporate-Logo-Bold-ver2";
}
.top-title-b h2 {
    font-size: 25px;
    color: #4799b7;
    font-family: "Corporate-Logo-Bold-ver2";
    line-height: 1.3;
    padding: 20px 0 0 0;
}
.top-title-b h2 span {
    font-size: 19px;
    color: #393524;
    font-family: "Corporate-Logo-Bold-ver2";
}
.top-title-b h2 img {
    width: 52px;
    position: relative;
    left: 12px;
    top: 6px;
}
.top-title-b p {
    width: 80%;
    font-size: 12px;
    margin: 0 auto;
    padding: 20px;
}
.top-title-c h2 {
    font-size: 27px;
    color: #4799b7;
    font-family: "Corporate-Logo-Bold-ver2";
}
.top-title-c h2 span {
    font-size: 19px;
    color: #393524;
    font-family: "Corporate-Logo-Bold-ver2";
}
.top-title-c h2 img {
    width: 52px;
    position: relative;
    left: 0px;
    top: 6px;
}
.top-title-c p {
    font-size: 15px;
    color: #393524;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-weight: 350;
    padding: 20px;
}

.top-title-d h2 {
    font-size: 27px;
    color: #4799b7;
    font-family: "Corporate-Logo-Bold-ver2";
}
.top-title-d h2 span {
    font-size: 19px;
    color: #393524;
    font-family: "Corporate-Logo-Bold-ver2";
}
.top-title-d h2 img {
    width: 52px;
    position: relative;
    left: 12px;
    top:  5px;
}
.top-photo {
  position: relative;
  z-index: -1;
}
.top-photo img {
  width: 100%;
  display: block;
  margin: 0 auto;
  margin-top: 0px;
  margin-bottom: 20px;
}
.box-two {
    width: 100%;
    margin: 0 auto;
    margin-top: 33px;
}

.box-two img {
    width: 100%;
    float: left;
}

.box-two p {
    font-size: 15px;
    line-height: 1.3;
    color: #383838;
    width: 90%;
    float: left;
    padding: 15px;
    text-align: justify;
    text-justify: inter-ideograph;
}
.box-two-b {
    width: 100%;
    margin: 0 auto;
    margin-top: 33px;
}

.box-two-b img {
    width: 100%;
    float: left;
}

.box-two-b p {
    font-size: 15px;
    line-height: 1.3;
    color: #383838;
    width: 90%;
    float: left;
    padding: 15px;
    text-align: justify;
    text-justify: inter-ideograph;
}
.box-four {
    width: 100%;
    margin: 0 auto;
}
.box-four img {
    width: 42%;
    float: none;
    text-align: center;
    padding: 7px;
    
}
.zoom-icon img {
    width: 100px;
    position: fixed;
    z-index: 500;
    left: 10px;
    top: 70%;
    opacity: .8;
    animation: purun 1.3s linear 0s 2;
    animation-iteration-count: infinite;
} 
.box-twelve-a {
    width: 50%;
    height: 200px;
    background: #ffe4b5;
    padding: 0px;
    display: inline-block;
    float: left;
}
.box-twelve-a img {
    width: 50%;
    padding: 20px 0 0 0;
}
.box-twelve-a h3 {
    font-size: 13px;
    color: #262626;
    padding: 0 0 0 0;
}
.box-twelve-a p {
    font-size: 11px;
    color: #262626;
    padding: 0 0 20px 0;
}
.box-twelve-b {
    width: 50%;
    height: 200px;
    background: #f86453;
    padding: 0px;
    display: inline-block;
    float: left;
}
.box-twelve-b img {
    width: 50%;
    padding: 20px 0 0 0;
}
.box-twelve-b h3 {
    font-size: 13px;
    color: #fff;
    padding: 0 0 0 0;
}
.box-twelve-b p {
    font-size: 11px;
    color: #fff;
    padding: 0 0 20px 0;
}
.box-twelve-c {
    width: 50%;
    height: 200px;
    background: #b0e0e6;
    padding: 0px;
    display: inline-block;
    float: left;
}
.box-twelve-c img {
    width: 50%;
    padding: 20px 0 0 0;
}
.box-twelve-c h3 {
    font-size: 13px;
    color: #262626;
    padding: 0 0 0 0;
}
.box-twelve-c p {
    font-size: 11px;
    color: #262626;
    padding: 0 0 20px 0;
}
.contact {
    background: #f86453;
    width: 80%;
    border-radius: 50px;
    margin: 0 auto;
    margin-bottom: 130px;
}
.contact img {
    width: 24px;
    display: inline-block;
    padding: 30px 0 0 0;
}
.contact p {
    font-size: 13px;
    font-weight: bold;
    color: #fff;
    padding: 10px 0 20px 10px;
    display: inline-block;
    vertical-align: 3px;
}
.contact-all {
    background: #f86453;
    width: 80%;
    border-radius: 50px;
    margin: 0 auto;
    margin-bottom: 0px;
}
.contact-all img {
    width: 24px;
    display: inline-block;
    padding: 30px 0 0 0;
}
.contact-all p {
    font-size: 13px;
    font-weight: bold;
    color: #fff;
    padding: 10px 0 20px 10px;
    display: inline-block;
    vertical-align: 3px;
}
.sns-method {
    width: 95%;
    margin: 0 auto;
}

.method-naka {
    width: 95%;
    height: 117px;
    background: #00bfff;
    padding: 0px;
    display: inline-block;
    float: none;
    margin: 0;
    border-radius: 10px;
}
.method-naka:hover {
    background: #00ace6;
}
.method-naka h3 {
    color: #fff;
    padding: 0 0 0 0;
    font-size: 25px;
}
.method-naka p {
    color: #fff;
    padding: 0 0 20px 0;
}
.method-naka-b {
    width: 95%;
    height: 117px;
    background: #32cd32;
    padding: 0px;
    display: inline-block;
    float: none;
    margin: 10px;
    border-radius: 10px;
}
.method-naka-b:hover {
    background: #43ac29;
}
.method-naka-b h3 {
    color: #fff;
    padding: 0 0 0 0;
    font-size: 25px;
}
.method-naka-b p {
    color: #fff;
    padding: 0 0 20px 0;
}
.method-naka-c {
    width: 95%;
    height: 117px;
    background: #f85441;
    padding: 0px;
    display: inline-block;
    float: none;
    margin: 10px;
    border-radius: 10px;
}
.method-naka-c:hover {
    background: #f62b14;
}
.method-naka-c h3 {
    color: #fff;
    padding: 0 0 0 0;
    font-size: 25px;
}
.method-naka-c p {
    color: #fff;
    padding: 0 0 20px 0;
}
.coverage img {
    margin: 0 auto;
    width: 90%;
    padding: 0px;
    margin-top: 15px;
}
/*index*/
    
/*company*/
    .company table {
		width: 90%;
}
/*company*/
    
/*アイテム*/
.point {
    background: #4799b7;
    width: 90%;
    border-radius: 50px;
    margin: 15 auto;
    margin-bottom: 20px;
}
.point img {
    width: 24px;
    display: inline-block;
    padding: 30px 0 0 0;
}
.point h2 {
    font-size: 13px;
    font-weight: bold;
    color: ##ECE312;
    padding: 10px;
    display: inline-block;
    vertical-align: 3px;
}
.point p {
    font-size: 13px;
    font-weight: bold;
    color: #fff;
    padding: 10px 0 20px 10px;
    display: inline-block;
    vertical-align: 3px;
}
.item-zu img {
    width: 90%;
    margin: 0 auto;
}
/*アイテム*/
    
/*ホームページ*/
.web-point {
    width: 100%;
    padding: 0px;
    margin: 0 auto;
}
.web-point h2 {
    font-size: 26px;
    color: #4799b7;
    font-family: "Corporate-Logo-Bold-ver2";
    padding: 20px;
}
.web-point table {
    width: 90%;
    border-collapse: collapse;
    float: none;
    margin: 0 auto;
}
.web-point table th,td {
    border: 0.5px solid #696969;
}
.web-point table th {
    font-size: 20px;
    color: #fff;
    padding: 12px 15px;
    background: #77b4ca;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-weight: 400;
}
.web-point table td {
    font-size: 15px;
    color: #303030;
    padding: 12px 10px;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-weight: normal;
}
.web-point table td span {
    font-size: 23px;
    color: #4596B3;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-weight: bold;
}
.box-web {
    background-color: #3b7F98;
    padding: 20px 0 20px 0;
    width: 100%;
    margin: 0px auto;
}
.box-web h2 {
 font-size: 18px;
 line-height: 1.3;
}
.box-web p {
    padding: 20px;
}
.box-web span {
 font-size: 15px;
}
.box-three {
    width: 100%;
    margin: 0 auto;
}
.box-three img {
    width: 80%;
    float: none;
    text-align: center;
    padding: 7px;
    
}
/*ホームページ*/
/*ポスティング*/
.sokyu-waku {
    width: 100%;
    margin: 0 auto;
}
.sokyu-waku h1 {
  font-size: 29px;
  color: #4799b7;
  font-family: "Corporate-Logo-Bold-ver2";
  line-height: 1.3;
}
.sokyu-waku h1 span {
  font-size: 23px;
  color: #393524;
  font-family: "Corporate-Logo-Bold-ver2";
}
.sokyu-waku-left {
    width: 100%;
    height: 410px;
    background: #ffe4b5;
    float: left;
}
.sokyu-waku-left h2 {
    padding: 10px 0 0 0;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-size: 37px;
    color: #f86453;
}
.sokyu-waku-left p {
    padding: 10px 30px 0 30px;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-size: 18px;
    color: #262626;
    text-align: left;
}
.sokyu-waku-right {
    width: 100%;
    height: 445px;
    background: #f86453;
    float: left;  
}
.sokyu-waku-right h2 {
    padding:  10px 0 0 0;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-size: 37px;
    color: #fff;
}
.sokyu-waku-right p {
    padding: 10px 30px 0 30px;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-size: 18px;
    color: #fff;
    text-align: left;
}
/*ポスティング*/
/*Blog*/
.news {
	margin: auto;
	width: 90%;
	height: 350px;
	overflow: auto;
	color: #696969;
	font-size: 14px;
}
/*Blog*/
/*LINEスタンプ*/
.box-four-b {
    width: 100%;
    margin: 0 auto;
}
.box-four-b img:hover {
    opacity: .7;
}
.box-four-b img {
    width: 30%;
    float: none;
    padding: 30px;
}
/*LINEスタンプ*/

/*SNSお問合せ方法*/
.method-phot img {
    width: 100%;
    margin: 0 auto;
}
/*SNSお問合せ方法*/
    
    
  h1 {
    color: #fff;
  }
  h2 {
    font-size: 18px;
  }

  .header {
    width: 100%;
  }
  .header-wrapper {
    min-width: 90%;
    width: 90%;
    margin: 0 auto;
    border-radius: 100px;
    margin-top: 11px;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2dccd3", endColorstr="#81d8d0", GradientType=1);
  }
.header-wrapper-top {
    min-width: 90%;
    width: 90%;
    margin: 0 auto;
    border-radius: 100px;
    margin-top: 12px;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2dccd3", endColorstr="#81d8d0", GradientType=1);
  }
.chara {
    width: 35px;
    padding: 10px;
}
.logo {
    width: 200px;
}
  .style-logo-sp {
    display: inline-block;
  }
  .style-logo-sp img {
    margin: left;
    width: 200px;
    padding: 15px;
  }
  .style-logo-sp p {
    color: #262626;
    position: absolute;
    top: 53px;
    left: 90px;
    font-size: 29px;
    font-weight: bold;
    font-family: "corp_round_v1";
    line-height: 0.8;
  }
  .style-logo-sp span {
    color: #262626;
    position: absolute;
    font-size: 20px;
    font-weight: normal;
    font-family: "corp_round_v1";
  }
  .style-mail {
    margin: right;
    width: 110px;
    position: absolute;
    top: 60px;
    right: -15px;
    padding: 15px;
  }
  .sns {
    display: inline-block;
    padding: 15px;
  }
  .sns img {
    display: inline-block;
    width: 45px;
    position: relative;
    z-index: 2;
    top: -87px;
    right: 60px;
  }
  .all-box {
    width: 100%;
  }
  .top-font p {
    font-family: "NotoSansJP-Black";
    font-size: 50px;
    color: #0BD6D0;
    text-align: left;
    transform: rotate(-5deg);
    width: 100%;
    margin: -345px 0px 0px -7px;
    line-height: 50px;
  }
  .top-line-c {
    background: #0abab5;
    height: 25px;
    margin-top: -30px;
  }
  .top-line-c p {
    font-size: 14px;
    color: #fff;
    text-align: left;
    padding: 15px;
    font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  }
  .company-name {
    width: 90%;
  }
  .company-name-c {
    width: 50%;
  }
  .company-name p {
    font-family: "OverpassMono-Bold";
    font-size: 30px;
    text-align: center;
    margin: 30px auto;
    display: block;
    line-height: 1.2;
  }
  .company-name-c p {
    font-family: "OverpassMono-Bold";
    font-size: 30px;
    text-align: center;
    margin: 30px auto;
    display: block;
    line-height: 1.2;
  }
  .item-box {
    width: 95%;
    margin: 0 auto;
  }
  .item-box img {
    width: 40%;
    padding: 10px;
  }
  .comment {
    width: 100%;
    margin: 0 auto;
  }
  .chara-blue img {
    width: 25%;
    padding: 20px;
    float: right;
    margin-top: -500px;
    z-index: 20;
  }
  .chara-cha img {
    width: 90%;
    padding: 5px;
    float: left;
    margin-top: 0px;
  }
  .comment-g {
    width: 98%;
    text-align: left;
    text-align: justify;
    margin: 0 auto;
    float: right;
    margin-top: 20px;
    font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  }
  .comment-r {
    width: 98%;
    text-align: left;
    text-align: justify;
    margin: 0 auto;
    float: right;
    margin-top: 20px;
    font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  }
  .chara-orange-top img {
    width: 90%;
    padding: 20px;
    float: right;
    margin-top: -12px;
    z-index: 800;
    position: relative;
  }
  .chara-orange img {
    width: 40%;
    padding: 28px;
    float: left;
    margin-left: -70px;
    margin-top: -230px;
  }
  .chara-orange-b img {
    width: 40%;
    padding: 28px;
    float: left;
    margin-left: 180px;
    margin-top: -230px;
  }
  .chara-orange-c img {
    width: 30%;
    padding: 28px;
    float: left;
    margin-left: -70px;
    margin-top: -190px;
  }
  .comment-o {
    width: 98%;
    text-align: left;
    text-align: justify;
    margin: 0 auto;
    float: right;
    margin-top: 20px;
    font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  }
  .flow img {
    width: 100%;
    padding: 0px;
    float: left;
    margin-top: 0px;
  }
  .comment-f {
    width: 90%;
    text-align: left;
    text-align: justify;
    margin: 19px;
    float: right;
    font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  }
  .comment-f p {
    font-size: 15px;
    color: #696969;
    font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  }
  .comment-f span {
    font-size: 25px;
  }
  .comment-c {
    width: 100%;
  }
  .comment-d {
    width: 100%;
  }
  .comment-e {
    width: 95%;
  }
  .puls img {
    margin: 0 auto;
    display: block;
    width: 50px;
    padding: 20px;
  }
  .naka-obi {
    background: #DAFDFC;
    margin: 0 auto;
    width: 100%;
    height: 3310px;
    z-index: -1.5;
  }
  .company table {
    width: 90%;
  }
  .kukan-style {
    margin-top: 110px;
  }
  .kaigyo-pac {
    background: #0abab5;
    border-radius: 20px;
    width: 95%;
    margin: 10px;
  }
  .tasu {
    float: none;
  }
  .tasu p {
    font-size: 60px;
    font-family: "corp_round_v1";
    color: #0abab5;
    padding: 10px;
    text-align: center;
  }
  .tel-banner img {
    margin: 0 auto;
    margin-top: -90px;
    width: 90%;
    display: block;
    padding: 20px;
  }
  .font-move {
    position: relative;
    max-width: 100%;
    margin: 0 auto;
    margin-top: 90px;
    font-weight: bold;
  }
  obi-box obi span {
    position: relative;
    color: #fff;
    font-family: "OverpassMono-Bold";
    padding: 10px 10px 7px 10px;
    font-size: 30px;
    line-height: 53px;
    letter-spacing: 0em;
    white-space: nowrap;
  }
  .zoom {
    text-align: center;
  }
  .zoom-photo {
    width: 90%;
  }
  .zoom-photo img {
    width: 90%;
  }
  .zoom-photo p {
    text-align: left;
    padding: 10px;
  }
  .zoom-photo img:hover {
    transform: scale(1.05, 1.05);
  }
  .blog-photo img {
    width: 100%;
    float: left;
    padding: 0px 20px 6px 0px;
  }
  .blog-photo p {
    font-size: 15px;
    text-align: left;
    color: #696969;
    padding: 18px;
    text-align: justify
  }
  .blog-photo p span {
    font-size: 30px;
    font-weight: bold;
    text-align: left;
    color: #696969;
    font-family: "corp_round_v1";
    line-height: 1.1;
    margin-top: -15px;
    display: block;
  }
  .blog-date {
    background: #0abab5;
    width: 80px;
    height: 300px;
    font-size: 13px;
    text-align: left;
    color: #fff;
    display: block;
    padding: 18px;
    margin: 18px;
  }
  .dott-line {
    width: 100%;
  }
  .sp-tel {
    background: #4799b7;
    width: 48%;
    height: 30px;
    position: fixed;
    bottom: 0;
    padding: 10px 0px;
    margin: 10px;
    line-height: .9;
    border-radius: 70px;
  }
  .sp-tel img {
    width: 20px;
    display: inline-block;
  }
  .sp-tel:hover {
    background: #326D83;
  }
  .sp-tel p {
    text-align: center;
    font-family: "corp_round_v1";
    font-weight: bold;
    font-size: 16px;
    color: #fff;
  }
  .sp-tel span {
    text-align: center;
    font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
    font-weight: normal;
    font-size: 11px;
  }
  .sp-mail {
    width: 50%;
    height: 35px;
    position: fixed;
    bottom: 0;
    right: 0;
    padding: 20px 0px;
    line-height: 0;
  }
  .sp-mail img {
    width: 90%;
    display: inline-block;
  }
  .sp-mail img:hover {
    opacity: 0.7;
  }
  .sp-mail p {
    text-align: center;
    font-family: "corp_round_v1";
    font-weight: bold;
    font-size: 20px;
    color: #fff;

  }
  .sp-mail span {
    text-align: center;
    font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
    font-weight: normal;
    font-size: 11px;
  }
  .sp-tel-w {
    border: solid 1px #fff;
    background: #FCBA00;
    width: 50%;
    height: 75px;
    position: fixed;
    bottom: 0;
    padding: 20px 0px;
    line-height: .9;
  }
  .sp-tel-w img {
    width: 20px;
    display: inline-block;
  }
  .sp-tel-w:hover {
    background: #FFD246;
  }
  .sp-tel-w p {
    text-align: center;
    font-family: "corp_round_v1";
    font-weight: bold;
    font-size: 20px;
    color: #fff;
  }
  .sp-tel-w span {
    text-align: center;
    font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
    font-weight: normal;
    font-size: 11px;
  }
  .sp-mail-w {
    border: solid 1px #fff;
    background: #0BD6D0;
    width: 50%;
    height: 75px;
    position: fixed;
    bottom: 0;
    right: 0;
    padding: 20px 0px;
    line-height: .9;
  }
  .sp-mail-w:hover {
    background: #0CF0E9;
  }
  .sp-mail-w img {
    width: 20px;
    display: inline-block;
  }
  .sp-mail-w p {
    text-align: center;
    font-family: "corp_round_v1";
    font-weight: bold;
    font-size: 20px;
    color: #fff;
  }
  .sp-mail-w span {
    text-align: center;
    font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
    font-weight: normal;
    font-size: 11px;
  }
    .title-app {
        width: 100%;
        margin: 0 auto;
    }
.title-app h1 span{
  font-family: "Corporate-Logo-Bold-ver2";
  font-size: 40px;
  color: #4799B7;
  line-height: 1.5;
  text-align: left;
}
.title-app h1 {
  font-family: "Corporate-Logo-Bold-ver2";
  font-size: 22px;
  color: #262626;
  text-align: left;
}
.title-app h2 span{
  font-family: "Corporate-Logo-Bold-ver2";
  font-size: 38px;
  color: #4799B7;
  line-height: 1.5;
}
.title-app h2 {
  font-family: "Corporate-Logo-Bold-ver2";
  font-size: 22px;
  color: #262626;
}
.title-app p {
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  font-size: 15px;
  color: #414141;
  width: 100%;
  margin: 0 auto;
  text-align: left;
  text-align: justify;
  text-justify: inter-ideograph;
}
.title-chui p {
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
    font-size: 14px;
    color: #414141;
    width: 90%;
    margin: 0 auto;
    text-align: justify;
    padding: 20px;
}
.app-back {
    background: #f0f8ff;
    padding: 40px 15px;
}
.app-kinou img {
    width: 100%;
    margin: 0 auto;
    padding: 20px 0px;
}
.app-box {
    width: 100%;
    margin: 0 auto;
}
.app-box img {
    width: 70%;
    float: none;
    margin: 15px;
}
.app-box-font span {
  font-family: "Corporate-Logo-Bold-ver2";
  font-size: 35px;
  color: #4799B7;
  line-height: 1.5;
}
.app-box-font p {
  font-family: "Corporate-Logo-Bold-ver2";
  font-size: 22px;
  color: #262626;
  text-align: center;
}
.app-box-font h2 {
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  font-size: 16px;
  font-weight: normal;
  color: #414141;
  width: 90%;
  margin: 0 auto;
  text-align: left;
  text-align: justify;
  text-justify: inter-ideograph;
  line-height: 1.4;
}
.app-box-r {
    width: 100%;
    margin: 0 auto;
}
.app-box-r img {
    width: 50%;
    float: none;
    margin: 15px;
}
.app-box-font-r {
    width: 100%;
}
.app-box-font-r span {
  font-family: "Corporate-Logo-Bold-ver2";
  font-size: 35px;
  color: #4799B7;
  line-height: 1.5;
  width: 100%;
}
.app-box-font-r p {
  font-family: "Corporate-Logo-Bold-ver2";
  font-size: 22px;
  color: #262626;
  text-align: center;
  width: 100%;
}
.app-box-font-r h2 {
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  font-size: 16px;
  font-weight: normal;
  color: #414141;
  margin: 0 auto;
  text-align: left;
  text-align: justify;
  text-justify: inter-ideograph;
  line-height: 1.4;
  width: 90%;
  padding: 20px;
}
.app-box-five-soto {
    width: 100%;
    margin: 0 auto;
}
.app-box-five {
    float: left;
    width: 50%;
}
.app-box-five img {
    width: 100%;
}
.app-box-five p {
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  font-size: 12px;
  color: #262626;
  text-align: center;
}
  .top-photo-app img {
    width: 100%;
    display: block;
    margin: 0 auto;
    margin-top: 0px;
    margin-bottom: 20px;
  }
.top-photo-all img {
    width: 100%;
    display: block;
    margin: 0 auto;
    margin-top: 0px;
    margin-bottom: 20px;
  }

.smafo-sokyu p {
    width: 100%;
    text-align: center;
    padding: 0px;
    font-size: 17px;
    font-family: "FLOPDesignFont";
    font-weight: bold;
    color: #4B452D;
  }
  .smafo-sokyu p span {
    font-size: 22px;
    font-family: "FLOPDesignFont";
    color: #4799B7;
  }
  .smafo-sokyu-b img {
    max-width: 1000px;
    margin: 0 auto;
    display: block;
  }
  .smafo-sokyu-b p {
    width: 950px;
    text-align: center;
    padding: 20px;
    font-size: 45px;
    font-family: "OverpassMono-Bold";
    font-weight: bold;
    color: #696969;
  }
  .smafo-sokyu-b p span {
    font-size: 60px;
    font-family: "corp_round_v1";
    color: #4799B7;
  }
  .price-box-big {
    margin: 0 auto;
    color: #4799B7;
    font-size: 25px;
    font-weight: bold;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    line-height: 0.3;
  }
  .price-box-small {
    color: #696969;
    font-size: 12px;
    font-weight: normal;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    line-height: 0.8;
  }
   .price-box-small-ll {
        width: 95%;
    }
  .price-box-small-ll p {
    padding: 15px;
    color: #696969;
    font-size: 12px;
    font-weight: normal;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    line-height: 1.3;
    text-align:justify;
  }
  .price-box-naka-waku {
    background: #4799B7;
    color: #fff;
    font-size: 12px;
    font-weight: normal;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    width: 250px;
    padding: 5px 13px;
    border-radius: 15px;
  }
  .price-box {
    width: 87%;
    text-align: center;
    float: none;
    margin: 0 auto;
  }
  .price-box-ue p {
    color: #4799B7;
    font-size: 22px;
    font-weight: bold;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    line-height: 1.3;
  }
  .price-box-ue span {
    color: #696969;
    font-size: 13px;
    font-weight: bold;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    line-height: 1.3;
  }
  .price-box-ue img {
    height: 60px;
    padding: 10px;
  }
  .price-box-ue-b p {
    color: #4799B7;
    font-size: 16px;
    font-weight: bold;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    line-height: 1.3;
  }
  .price-waku table {
    float: left;
    width: 97%;
    border: 1px solid #515151;
    margin: 5px;
    text-align: left;
    color: #262626;
    font-size: 17px;
    border-collapse: collapse;
  }
  .price-waku table th {
    border: 1px dotted #515151;
    padding: 7px 15px;
    background: #D6E8EF;
    font-size: 20px;
  }
  .price-waku table td {
    border: 1px dotted #515151;
    padding: 7px 20px;
    text-align: left;
    font-size: 18px;
    color: #696969;
  }
  .price-waku table td form {
    text-align: left;
    font-size: 15px;
    font-family: Meiryo, YuGothic, "Yu Gothic medium", "Hiragino Sans", "sans-serif";
    color: #262626;
    padding: 30px 10px;
  }
  .button-style {
    background: #4799B7;
    width: 70%;
    margin: 0 auto;
    padding: 10px 12px;
    border-radius: 50px;
  }
  .button-style:hover {
    background: #6CAEC6;
  }
  .button-style a {
    text-decoration: none;
  }
  .button-style p {
    text-align: center;
    font-family: Meiryo, YuGothic, "Yu Gothic medium", "Hiragino Sans", "sans-serif";
    font-size: 12px;
    color: #fff;
    line-height: 1.2;
  }
  .button-style-all {
    background: #4799B7;
    width: 52%;
    margin: 0 auto;
    padding: 10px 12px;
    border-radius: 50px;
  }
  .button-style-all:hover {
    background: #6CAEC6;
  }
  .button-style-all a {
    text-decoration: none;
  }
  .button-style-all p {
    text-align: center;
    font-family: Meiryo, YuGothic, "Yu Gothic medium", "Hiragino Sans", "sans-serif";
    font-size: 16px;
    color: #fff;
    line-height: 1.2;
  }
  .button-style-all img {
    text-align: center;
    width: 14px;
    padding: 5px 0px 0px 0px;
  }
  /*タブ切り替え全体のスタイル*/
  .tab-box {
    margin-top: 50px;
    padding-bottom: 40px;
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    width: 100%;
    margin: 0 auto;
  }
  /*タブのスタイル*/
  .tab_item {
    width: calc(100%/3);
    height: 50px;
    border-bottom: 3px solid #4799B7;
    background-color: #d9d9d9;
    line-height: 50px;
    font-size: 12px;
    text-align: center;
    color: #565656;
    display: block;
    float: left;
    text-align: center;
    font-weight: bold;
    transition: all 0.2s ease;
  }
  .tab_item:hover {
    opacity: 0.75;
  }
  /*ラジオボタンを全て消す*/
  input[name="tab_item"] {
    display: none;
  }
  /*タブ切り替えの中身のスタイル*/
  .tab_content {
    display: none;
    padding: 40px 40px 0;
    clear: both;
    overflow: hidden;
  }
  /*選択されているタブのコンテンツのみを表示*/
  #one:checked ~ #one_content, #two:checked ~ #two_content, #three:checked ~ #three_content {
    display: block;
  }
  /*選択されているタブのスタイルを変える*/
  .tab-box input:checked + .tab_item {
    background-color: #4799B7;
    color: #fff;
  }
  .size-tab table {
    margin: 0 auto;
    width: 80%;
  }
  .size-tab table td {
    width: 20px;
    height: 20px;
    vertical-align: center;
    padding: 3px;
  }
.size-tab-b table {
    margin: 0 auto;
    width: 80%;
  }
  .size-tab-b table td {
    width: 20px;
    height: 20px;
    vertical-align: center;
    padding: 3px;
  }
  .menu-select-naka {
    padding: 1em 1em;
    margin: 0em 0;
    background: #fff;
    border: dashed 2px #00cccc; /*点線*/
  }
  .menu-select-naka p {
    font-size: 15px;
    margin: 0;
    padding: 0;
  }
    


.mail-form iframe {
    width: 100%;
    height: 730px;
}
.mail-form-zoom iframe {
    width: 100%;
    height: 1180px;
}
    
/*========= スクロールダウンのためのCSS ===============*/


/*=== 9-1-4 矢印が動いてスクロールを促す  ====*/

/*スクロールダウン全体の場所*/
.scrolldown4{
    /*描画位置※位置は適宜調整してください*/
  position:absolute;
  bottom:1%;
  right:50%;
    /*矢印の動き1秒かけて永遠にループ*/
  animation: arrowmove 1s ease-in-out infinite;
}

/*下からの距離が変化して全体が下→上→下に動く*/
@keyframes arrowmove{
      0%{bottom:1%;}
      50%{bottom:3%;}
     100%{bottom:1%;}
 }

/*Scrollテキストの描写*/
.scrolldown4 span{
    /*描画位置*/
  position: absolute;
  left:-20px;
  bottom:5px;
    /*テキストの形状*/
  color: #113b39;
  font-size: 10px;
  font-weight: bold;
  letter-spacing: 0.05em;
  text-shadow:1px 1px 0 #fff, -1px -1px 0 #fff,
              -1px 1px 0 #fff, 1px -1px 0 #fff,
              0px 1px 0 #fff,  0-1px 0 #fff,
              -1px 0 0 #fff, 1px 0 0 #fff;
  /*縦書き設定*/
  -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
}

/* 矢印の描写 */
.scrolldown4:before {
    content: "";
    /*描画位置*/
    position: absolute;
    bottom: 0;
    right: -6px;
    /*矢印の形状*/
    width: 1px;
    height: 19px;
    background: #113b39;
    transform: skewX(-31deg);
}

.scrolldown4:after{
  content:"";
    /*描画位置*/
  position: absolute;
  bottom:0;
  right:0;
    /*矢印の形状*/
  width:1px;
  height: 40px;
  background: #113b39;
}

/*========= スクロールダウンのためのCSS ===============*/    

    
    
  /* ハンバーガークリック後メニュー中身 */
  /***** ハンバーガーここまで *****/