@charset "utf-8";
 /* CSS Document */
 
 body,
 h1,
 h2,
 h3,
 h4,
 p,
 ul,
 li,
 dl,
 dt,
 dd {
     margin: 0;
     padding: 0;
     list-style-type: none;
 }
 
 img {
     vertical-align: bottom;
 }
 
 body {
     font-size: 20px;
     font-family: "游明朝", "YuMincho", "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
     /*font-family: "YuMincho", "游明朝体", "游明朝", "MS P明朝", "MS 明朝", "游ゴシック", "Yu Gothic";*/
 }
 
 .flex,
 .flex2 {
     display: flex;
 }
 
 .space {
     justify-content: space-between;
 }
 
 .around {
     justify-content: space-around;
 }
 
 .inner {
     width: 1080px;
     margin-left: auto;
     margin-right: auto;
 }
 /********************** <header> 背景色orange**********************/
 
 header {
     background: linear-gradient(to left, #ffb531 80%, rgb(253, 222, 154));
     position: fixed;
     z-index: 9999;
     width: 100%;
     padding: 10px 0 20px;
 }
 
 header h1 {
     padding: 0 20px 0;
 }
 
 header h1 a {
     text-decoration: none;
     color: #fff;
 }
 
 header h1 span {
     font-size: 23px;
     padding-right: 0.5em;
 }
 
 header h1 a:hover {
     color: #ff680d;
     filter: opacity(85%);
 }
 
 header .tell {
     margin: 15px 20px 0 0;
     color: #fff;
 }
 
 header .onmouse:hover {
     filter: brightness(110%);
 }
 
 header ul {
     font-size: 18px;
     margin-top: 5px;
 }
 
 header ul li {
     padding-left: 20px;
 }
 
 .my-parts {
     position: relative;
     text-decoration: none;
     color: #fff;
     padding: 0 10px 0 5px;
 }
 
 .my-parts:hover {
     cursor: pointer;
     background-position: -100% 0;
     color: #ff680d;
     padding-bottom: 5px;
 }
 
 .my-parts::after {
     position: absolute;
     bottom: -4px;
     left: 0;
     content: '';
     width: 100%;
     height: 2px;
     background: #ff680d;
     transform: scale(0, 1);
     transform-origin: left top;
     transition: transform .3s;
 }
 
 .my-parts:hover::after {
     cursor: pointer;
     transform: scale(1, 1);
     color: #ff680d;
 }
 /********************** </header> 背景色orange**********************/
 /********************** <main> **********************/
 
 section {
     margin-top: 70px;
 }
 
 h2 {
     margin-bottom: 45px;
     font-weight: normal;
     text-align: center;
     display: flex;
     align-items: center;
     /* 垂直中心 */
     justify-content: center;
     /* 水平中心 */
 }
 
 h2:before,
 h2:after {
     border-top: 3px solid;
     content: "";
     width: 6em;
     /* 線の長さ */
 }
 
 h2:before {
     margin-right: 1em;
     /* 文字の右隣 */
 }
 
 h2:after {
     margin-left: 1em;
     /* 文字の左隣 */
 }
 
 h2:before,
 h2:after {
     width: 4em;
     /* 線の長さ */
 }
 
 h3 {
     text-align: center;
     background-image: url(../images/about_underbar.png);
     background-repeat: no-repeat;
     background-position: center bottom;
     font-weight: normal;
     margin-bottom: 10px;
 }
 
 h3.sakura-kaikan {
     background-size: 10em;
 }
 
 .indent {
     text-align: justify;
 }
 
 .bg-radius-orange {
     background-color: #ffd29c;
     border-radius: 50%;
 }
 
 .bg-white {
     background-image: url(../images/bg_white.png);
     background-position: top;
     background-repeat: no-repeat;
 }
 
 .bg-white2 {
     background-image: url(../images/bg_white2.png);
     background-position: top;
     background-repeat: no-repeat;
 }
 
 .bg_color {
     background: #fff7d4;
     padding: 35px 0 50px;
 }
 
 #content {
     position: relative;
 }
 
 #topBtn {
     /*-----必須-----*/
     position: fixed;
     bottom: 10px;
     right: 10px;
 }
 
 #topBtn:hover {
     transform: translateY(-0.5em);
 }
 
 .zoom:hover {
     transform: scale(1.1, 1.1);
 }
 
 .zoom:active {
     position: relative;
     top: 5px;
 }
 /********************** </main> **********************/
 /********************** <footer> **********************/
 
 footer {
     color: #fff;
     background: linear-gradient(to right, #ffd271 0%, #ffb531 15%, #ffb531 84%, #ffd271 100%);
     margin-top: 130px;
     line-height: 1.5;
 }
 
 footer div.inner {
     padding-top: 30px;
 }
 
 div.left {
     width: 450px;
 }
 
 footer dl {
     line-height: 2em;
 }
 
 footer dt {
     float: left;
     clear: left;
 }
 
 footer dd {
     padding-left: 60px;
 }
 
 footer dd::before {
     content: "：";
 }
 
 div.right {
     width: 550px;
 }
 
 footer ul.wrap {
     flex-wrap: wrap;
 }
 
 footer ul li {
     font-size: 16px;
     width: 130px;
     padding-top: 10px;
 }
 
 footer li:before {
     content: "|";
 }
 
 footer a {
     color: #fff;
     text-decoration: none;
 }
 
 footer a:hover {
     cursor: pointer;
     color: #d6d6d6;
 }
 
 footer .copyright {
     text-align: right;
     font-size: 14px;
     padding: 30px 25px 0 0;
 }
 /********************** </footer> **********************/
 /**********************<レスポンシブ>*********************/
 
 @media screen and (max-width:640px) {
     .inner {
         width: auto;
     }
     img {
         max-width: 100%;
         height: auto;
     }
     .flex {
         /* displayの初期値を解除する*/
         display: block;
     }
     body {
         font-size: 16px;
     }
     .flex2 {
         justify-content: space-around;
     }
     header {
         background: linear-gradient(to left, #ffb531 80%, rgb(253, 227, 170));
     }
     header h1 {
         font-size: 22px;
     }
     header h1 span {
         font-size: 16px;
     }
     br.break {
         display: none;
     }
     /*********************ハンバーガーボタン***********************/
     .hamburger {
         display: block;
         position: fixed;
         z-index: 3;
         right: 13px;
         top: 0;
         width: 42px;
         height: 42px;
         cursor: pointer;
         text-align: center;
     }
     .hamburger span {
         display: block;
         position: absolute;
         width: 30px;
         height: 2px;
         left: 6px;
         background: #fff;
         -webkit-transition: 0.3s ease-in-out;
         -moz-transition: 0.3s ease-in-out;
         transition: 0.3s ease-in-out;
     }
     .hamburger::after {
         position: absolute;
         left: 0;
         bottom: -10px;
         z-index: 4;
         content: 'メニュー';
         display: block;
         width: 100%;
         color: #fff;
         font-size: 10px;
         text-decoration: none;
         text-align: center;
         white-space: nowrap;
         transition: all .4s;
     }
     .hamburger span:nth-child(1) {
         top: 10px;
     }
     .hamburger span:nth-child(2) {
         top: 20px;
     }
     .hamburger span:nth-child(3) {
         top: 30px;
     }
     /* ナビ開いてる時のボタン */
     .hamburger.active span:nth-child(1) {
         top: 16px;
         left: 6px;
         background: #fff;
         -webkit-transform: rotate(-45deg);
         -moz-transform: rotate(-45deg);
         transform: rotate(-45deg);
     }
     .hamburger.active span:nth-child(2),
     .hamburger.active span:nth-child(3) {
         top: 16px;
         background: #fff;
         -webkit-transform: rotate(45deg);
         -moz-transform: rotate(45deg);
         transform: rotate(45deg);
     }
     .hamburger.active::after {
         content: '閉じる';
         bottom: -10px;
         z-index: 4;
         color: #fff;
     }
     /**********************電話・ロゴ**********************/
     div.globalMenuSp {
         position: fixed;
         z-index: 3;
         color: #fff;
         text-align: center;
         width: 100%;
         display: none;
         top: 10%;
     }
     div.globalMenuSp .flex2 {
         margin: 0 auto;
         padding: 0;
         width: 100%;
         position: relative;
         top: 10%;
     }
     div.globalMenuSp .flex2 p {
         list-style-type: none;
         padding: 0;
         transition: .4s all;
         font-size: 20px;
         font-weight: bold;
     }
     div.globalMenuSp .flex2 p:last-child {
         padding-bottom: 0;
     }
     /* このクラスを、jQueryで付与・削除する*/
     div.globalMenuSp.active {
         display: block;
     }
     /***********************</電話・ロゴ>**********************/
     nav.globalMenuSp {
         position: fixed;
         z-index: 2;
         top: 0;
         left: 0;
         color: #fff;
         background: rgba(234, 198, 146, 0.85);
         text-align: center;
         width: 100%;
         height: 100%;
         display: none;
     }
     nav.globalMenuSp ul {
         margin: 0 auto;
         padding: 0;
         width: 100%;
         position: relative;
         top: 20%;
     }
     nav.globalMenuSp ul li {
         list-style-type: none;
         padding: 0;
         width: 100%;
         transition: .4s all;
         font-size: 20px;
         font-weight: bold;
         border-bottom: solid 0.5px #fff;
     }
     nav.globalMenuSp ul li:last-child {
         padding-bottom: 0;
     }
     nav.globalMenuSp ul li a {
         display: block;
         color: #fff;
         padding: 1em 0;
         text-decoration: none;
     }
     nav.globalMenuSp.active {
         display: block;
     }
     /***********************************/
     ul.space,
     div.left,
     div.right {
         width: auto;
     }
     section {
         margin-top: 30px;
     }
     #topBtn img {
         width: 70%;
     }
     h2 {
         font-size: 20px;
         margin-bottom: 0;
     }
     h3 {
         text-align: center;
         background-position: center bottom;
     }
     .bg-white,
     .bg-white2 {
         background-size: cover;
     }
     div.left,
     div.right {
         margin-left: 20px;
     }
     div.right {
         margin-top: 20px;
     }
     div.right p:before {
         content: "−";
     }
     div.right p:after {
         content: "−";
     }
     footer dd {
         padding-left: 0;
     }
     footer ul.flex {
         display: flex;
     }
     footer li:before {
         content: "|";
         color: #f4f4f4;
     }
     footer ul a {
         color: #f4f4f4;
     }
     footer .copyright {
         padding-right: 0;
         text-align: center;
     }
 }
 /**********************</レスポンシブ>*********************/