@charset "UTF-8";
h1, h2, h3, h4, h5, p, div, a:link, a:visited { color: #003366; }

.entry-list { background: #eeeecc; }

#footer { display: inline-block; width: 100%; padding: 40px 0; }

@media only screen and (max-width: 768px) { #footer { padding: 20px 0 40px; } }

#handson { width: 100%; clear: both; }

#handson .item { width: 250px; display: inline-block; }

#news { width: 100%; clear: both; }

#news .item { width: 250px; display: inline-block; }

*, *:before, *:after { -webkit-box-sizing: border-box; box-sizing: border-box; }

.pconly { display: inline-block; }

@media only screen and (max-width: 768px) { .pconly { display: none; } }

.sponly { display: none; }

@media only screen and (max-width: 768px) { .sponly { display: inline-block; } }

#site-header { padding-bottom: 20px; max-width: 1280px; min-width: 1024px; margin: 40px auto 0; -webkit-transition: 0.4s; transition: 0.4s; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; justify-items: flex-end; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }

@media only screen and (max-width: 768px) { #site-header { display: block; width: 100%; min-width: auto; overflow: visible; position: fixed; z-index: 999999; background: #fff; margin-top: 0; padding: 0px 0; height: 70px; } }

#site-header #site-logo { margin-right: 40px; margin-left: 20px; margin-top: 20px; width: 190px; }

@media only screen and (max-width: 768px) { #site-header #site-logo { float: none; } }

#site-header #site-logo a { font-size: 2rem; font-family: "Renner*"; font-weight: 500; line-height: 1; text-decoration: none; color: #003366; -webkit-transition: 0.4s; transition: 0.4s; }

#site-header nav { padding-bottom: 5px; width: calc(100% - 190px - 280px); }

.home #site-header nav { text-align: center; width: 100%; margin-bottom: 20px; }

#site-header nav ul { display: -webkit-box; display: -ms-flexbox; display: flex; }

.home #site-header nav ul { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

#site-header nav ul li { padding-right: 20px; margin-right: 20px; line-height: 1; border-right: 1px solid #003366; position: relative; }

#site-header nav ul li a:link, #site-header nav ul li a:visited { line-height: 1; text-decoration: none; color: #003366; position: relative; display: inline-block; white-space: nowrap; }

#site-header nav ul li a::after, #site-header nav ul li a.select::after { position: absolute; bottom: -1px; z-index: -1; left: 0; content: ""; width: 100%; height: 6px; background: #ffeecc; -webkit-transform: scale(0, 1); transform: scale(0, 1); -webkit-transform-origin: right top; transform-origin: right top; -webkit-transition: -webkit-transform 0.3s; transition: -webkit-transform 0.3s; transition: transform 0.3s; transition: transform 0.3s, -webkit-transform 0.3s; }

#site-header nav ul li a:hover::after, #site-header nav ul li a.select::after { -webkit-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(1, 1); transform: scale(1, 1); }

#site-header nav ul li:last-child { border: none; padding: 0; margin: 0; }

#site-header nav ul li ul { display: block; position: absolute; top: 1em; left: -3em; right: -2em; z-index: 9999; }

#site-header nav ul li ul:before { content: ""; display: block; width: 0; height: 0; margin: 5px auto 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #003366; }

#site-header nav ul li ul li { padding: 0; margin: 0; width: 100%; display: inline-block; background-color: #efefef; font-weight: bold; border-right: none; }

#site-header nav ul li ul li a { border: 2px solid #003366; border-width: 0px 2px 1px 2px; }

#site-header nav ul li ul li:first-child a { border-width: 2px 2px 1px 2px; }

#site-header nav ul li ul li:last-child a { border-width: 0px 2px 2px 2px; }

#site-header nav ul li ul li a:link, #site-header nav ul li ul li a:visited { padding: 20px; display: block; background-color: #ffffff; -webkit-transition: 0.4s; transition: 0.4s; }

#site-header nav ul li ul li a:hover { color: #ffffff; background: #003366; -webkit-transition: 0.4s; transition: 0.4s; }

#site-header .sns { text-align: right; padding-bottom: 5px; }

@media only screen and (max-width: 768px) { #site-header .sns { display: none; } }

#site-header .sns ul { display: -webkit-box; display: -ms-flexbox; display: flex; }

#site-header .sns ul li { list-style: none; margin-right: 30px; }

#site-header .sns ul li img { vertical-align: bottom; height: 32px; width: 30px; }

/* -- #menu -------------------------------------------------------------------------------- */
@media only screen and (max-width: 768px) { #pcmenu { display: none !important; } }

#spmenu { display: none; }

@media only screen and (max-width: 768px) { .home #spmenu { top: 60px; }
  #spmenu { list-style-type: none; width: 100%; background: #ffffff; position: absolute; left: 0px; top: 60px; z-index: 9999; overflow-x: scroll; height: 100vh; }
  #spmenu .gnav li { text-align: center; font-size: 1.4375rem; font-family: "M PLUS 1p", sans-serif; }
  #spmenu .gnav li a { text-decoration: none; display: block; padding: 15px 0; color: #003366; position: relative; }
  #spmenu .gnav li a:hover { color: #ffffff; background: #003366; opacity: 0.7; font-weight: 600; -webkit-transition: 0.4s; transition: 0.4s; }
  #spmenu .gnav li a:hover:before { border-color: #ffffff; }
  #spmenu .gnav li a:before { content: ""; display: block; position: absolute; right: 10px; top: calc(50% - 4px); width: 8px; height: 8px; border-top: 2px solid #003366; border-right: 2px solid #003366; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
  #spmenu .gnav li .nestnav:before { display: none; }
  #spmenu .sns { display: block; margin: 40px 0; text-align: center; padding-bottom: 20px; }
  #spmenu .sns ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
  #spmenu .sns ul li { list-style: none; text-align: center; margin: 0 0 30px; width: 33.3%; }
  #spmenu .sns ul li a:before { display: none; }
  #spmenu .sns ul li img { vertical-align: bottom; height: calc(60px); width: calc(60px); }
  #spmenu .sns ul li:last-child { margin-right: 0; }
  #spmenu .nestnav { pointer-events: none; background-color: #eeeeee; font-weight: bold; }
  #spmenu .nestnav:hover { font-weight: bold; } }

.nestnav { pointer-events: none; }

/* -- spmenu-------------------------------------------------------------------------------- */
div#sp-icon { display: none; }

@media only screen and (max-width: 768px) { div#sp-icon { display: block; width: 70px; height: 70px; position: absolute; right: 0px; top: 0px; z-index: 999; } }

div#sp-icon:hover { cursor: pointer; opacity: 0.7; }

div#sp-icon span, div#sp-icon span:before, div#sp-icon span:after { display: inline-block; width: 30px; height: 3px; background: #000000; position: absolute; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; }

div#sp-icon span { left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

div#sp-icon span:before { content: ""; -webkit-transform: translateY(-10px) rotate(0deg); transform: translateY(-10px) rotate(0deg); }

div#sp-icon span:after { content: ""; -webkit-transform: translateY(10px) rotate(0deg); transform: translateY(10px) rotate(0deg); }

div.sp-open span { background: transparent !important; }

div.sp-open span:before { -webkit-transform: rotate(45deg) !important; transform: rotate(45deg) !important; }

div.sp-open span:after { -webkit-transform: rotate(-45deg) !important; transform: rotate(-45deg) !important; }

.main { margin-bottom: 20px; }

@media only screen and (max-width: 768px) { #main { padding-top: 70px; } }

.pageheader { height: 200px; background: #fff url(../images/hero.svg) bottom center no-repeat; background-size: contain; max-width: 100%; margin-bottom: 100px; position: relative; -webkit-transition: 0.4s; transition: 0.4s; }

.pageheader:before { display: block; content: ""; height: 2px; background-color: #003366; width: 100%; position: absolute; bottom: 0; z-index: 999; }

@media only screen and (max-width: 768px) { .pageheader { background: #fff url(../images/hero_sp.svg) bottom center no-repeat; margin-bottom: 50px; height: auto; background-size: 105%; -webkit-transition: 0.4s; transition: 0.4s; padding-top: 10%; } }

.pageheader .pageheader_inner { max-width: 980px; margin: 0 auto; -webkit-transition: 0.4s; transition: 0.4s; position: relative; height: 200px; overflow: hidden; padding: 0 20px; transition: 0.4s; }

@media only screen and (max-width: 768px) { .pageheader .pageheader_inner { display: block; width: 100%; padding: 0; height: 100px; -webkit-transition: 0.4s; transition: 0.4s; } }

.pageheader .pageheader_inner h1 { color: #003366; font-size: 4.75rem; font-family: "Renner*"; font-weight: 500; line-height: 1; -webkit-transition: 0.4s; transition: 0.4s; position: absolute; bottom: -14px; left: 20px; text-shadow: 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #f00, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff; transition: 0.4s; }

@media only screen and (max-width: 768px) { .pageheader .pageheader_inner h1 { font-size: 2.5rem; bottom: -7px; -webkit-transition: 0.4s; transition: 0.4s; text-shadow: 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #f00, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff; } }

#footer { text-align: center; }

#footer .sitename { font-size: 4rem; font-family: "Renner*"; font-weight: 500; line-height: 1; -webkit-transition: 0.4s; transition: 0.4s; margin-bottom: 20px; }

#footer .sitename a:link, #footer .sitename a:visited { text-decoration: none; color: #003366; }

@media only screen and (max-width: 768px) { #footer .sitename { font-size: 3.5rem; } }

#footer .sns { text-align: center; padding-bottom: 20px; }

#footer .sns ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

#footer .sns ul li { list-style: none; margin-right: 30px; }

#footer .sns ul li img { vertical-align: bottom; height: 34px; width: 30px; }

#footer .sns ul li:last-child { margin-right: 0; }

#footer .address { text-decoration: none; font-size: 0.9375rem; line-height: 1.8; margin-bottom: 20px; }

#footer .address a:link, #footer .address a:visited { text-decoration: none; color: #003366; }

#footer .address a:hover { text-decoration: underline; }

#footer .contact { font-size: 1.625rem; margin-bottom: 20px; }

#footer .contact a:link, #footer .contact a:visited { text-decoration: none; color: #003366; }

#footer .contact a:hover { text-decoration: underline; }

#footer .waibilogo { margin-bottom: 20px; font-size: 0.75rem; }

#footer .waibilogo img { display: block; margin: 0 auto 5px; width: 88px; height: 88px; }

#footer small { font-size: 0.75rem; margin-bottom: 80px; }

@media only screen and (max-width: 768px) { #footer small { font-size: 1rem; } }

#maincontent { max-width: 1020px; margin: 0 auto; }

.service .mainimage { margin: 0 auto; width: 795px; text-align: center; margin-bottom: 70px; -webkit-transition: 0.4s; transition: 0.4s; }

@media only screen and (max-width: 768px) { .service .mainimage { width: 100%; margin: 0 auto 40px; -webkit-transition: 0.4s; transition: 0.4s; } }

.main_inner .whatsdiystudio_read { text-align: left; margin: 0 auto; width: 1020px; -webkit-transition: 0.4s; transition: 0.4s; }

@media only screen and (max-width: 768px) { .main_inner .whatsdiystudio_read { width: 100%; margin: 0 auto; } }

.main_inner .whatsdiystudio_read h2 { font-size: 2.25rem; font-family: "M PLUS 1p", sans-serif; font-weight: 600; line-height: 1.6; -webkit-transition: 0.4s; transition: 0.4s; margin-bottom: 10px; }

@media only screen and (max-width: 768px) { .main_inner .whatsdiystudio_read h2 { font-size: 1.5rem; } }

.main_inner .whatsdiystudio_read h2 + .read p { font-size: 1.125rem; }

.whatsdiystudio { border: 2px solid #003366; border-width: 2px 0; margin-bottom: 20px; }

.whatsdiystudio img { vertical-align: bottom; }

.whatsdiystudio p { max-width: 720px; margin: 0 auto; }

.whatsdiystudio ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 940px; margin: 0 auto; }

.whatsdiystudio ul li { list-style: none; margin-bottom: 15px; }

.whatsdiystudio ul li:nth-child(1) { width: 340px; }

.whatsdiystudio ul li:nth-child(2) { width: 180px; margin-top: 15px; }

.whatsdiystudio ul li:nth-child(3) { width: 330px; margin-top: 13px; }

.whatsdiystudio ul li:nth-child(4) { width: 330px; margin-top: 24px; }

.whatsdiystudio ul li:nth-child(5) { width: 298px; margin-top: 18px; }

.whatsdiystudio ul li:nth-child(6) { width: 207px; }

.whatsdiystudio ul li:nth-child(7) { width: 350px; margin-top: calc(-8px - 15px); }

.whatsdiystudio ul li:nth-child(8) { width: 248px; margin-top: calc(-2px - 15px); }

.whatsdiystudio ul li:nth-child(9) { width: 240px; margin-top: calc(8px - 15px); }

.whatsdiystudio + h3 { text-align: left; width: 90%; margin: 0 auto 20px; }

.whatsdiystudio + h3 + .read { text-align: left; width: 90%; margin: 0 auto 20px; }

@media only screen and (max-width: 768px) { .whatsdiystudio ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 90%; margin: 0 auto 20px; -webkit-transition: 0.4s; transition: 0.4s; }
  .whatsdiystudio ul li { list-style: none; margin-bottom: 5px; }
  .whatsdiystudio ul li:nth-child(1) { width: 36%; }
  .whatsdiystudio ul li:nth-child(2) { width: 20%; margin-top: 15px; }
  .whatsdiystudio ul li:nth-child(3) { width: 36%; margin-top: 13px; }
  .whatsdiystudio ul li:nth-child(4) { width: 33%; margin-top: 24px; }
  .whatsdiystudio ul li:nth-child(5) { width: 33%; margin-top: 18px; }
  .whatsdiystudio ul li:nth-child(6) { width: 26%; }
  .whatsdiystudio ul li:nth-child(7) { width: 36%; margin-top: calc(-8px - 15px); }
  .whatsdiystudio ul li:nth-child(8) { width: 26%; margin-top: calc(-2px - 15px); }
  .whatsdiystudio ul li:nth-child(9) { width: 26%; margin-top: calc(8px - 15px); } }

.servicelist { margin: 0 auto; width: 1020px; -webkit-transition: 0.4s; transition: 0.4s; padding: 0 20px; }

@media only screen and (max-width: 768px) { .servicelist { width: 94%; padding: 0; } }

.servicelist .adjusting { display: block; padding: 0 0 50px; text-align: center; font-size: 1.125rem; font-weight: bold; }

.servicelist .item { display: -webkit-box; display: -ms-flexbox; display: flex; margin-bottom: 40px; }

@media only screen and (max-width: 768px) { .servicelist .item { display: block; margin-bottom: 50px; } }

.servicelist .item .content { width: calc(100% - 405px); }

@media only screen and (max-width: 768px) { .servicelist .item .content { width: 100%; padding: 0 0; } }

.servicelist .item .itemheader .number { height: 68px; width: 68px; display: inline-block; float: left; margin-right: 15px; }

.servicelist .item figure { -ms-flex-negative: 0; flex-shrink: 0; width: 380px; margin-right: 30px; display: inline-block; }

@media only screen and (max-width: 768px) { .servicelist .item figure { width: 100%; margin: 0 auto 20px; display: block; }
  .servicelist .item figure img { width: 100%; } }

.servicelist .item h2 { font-size: 2.875rem; font-family: "Renner*"; font-weight: 500; line-height: 1; -webkit-transition: 0.4s; transition: 0.4s; margin-bottom: 5px; }

@media only screen and (max-width: 768px) { .servicelist .item h2 { font-size: 1.7rem; margin-bottom: 0; padding-top: 5px; font-weight: 600; } }

.servicelist .item h3 { font-size: 1.4375rem; font-family: "M PLUS 1p", sans-serif; letter-spacing: -0.5px; margin-bottom: 20px; }

@media only screen and (max-width: 768px) { .servicelist .item h3 { font-size: 1.125rem; } }

.servicelist .item .caption { font-size: 1.0625rem; margin-bottom: 20px; }

@media only screen and (max-width: 768px) { .servicelist .item .caption { font-size: 0.9375rem; } }

.servicelist .item .notes { margin-bottom: 40px; }

@media only screen and (max-width: 768px) { .servicelist .item .notes { margin-bottom: 20px; } }

.servicelist .item .notes p { font-size: 0.8125rem; line-height: 1.6; border: 2px solid #003366; padding: 7px 7px 4px; display: inline-block; }

.servicelist .item .notes p:not(:last-child) { margin-bottom: 10px; }

.servicelist .item .text p { margin-bottom: 1em; font-size: 0.9375rem; line-height: 1.8; }

.servicelist .item .moredetail { text-align: right; margin-top: 40px; }

@media only screen and (max-width: 768px) { .servicelist .item .moredetail { text-align: center; } }

.servicelist .item .moredetail a { display: inline-block; text-decoration: none; border: 1px solid #003366; color: #ffffff; background: #003366; padding: 7px 7px 6px; font-size: 1.0625rem; font-family: "M PLUS 1p", sans-serif; letter-spacing: -0.5px; margin-bottom: 20px; -webkit-transition: 0.4s; transition: 0.4s; }

.servicelist .item .moredetail a:hover { border: 1px solid #003366; color: #003366; background: #ffffff; }

@media only screen and (max-width: 768px) { .servicelist .item .moredetail a { width: 80%; text-align: center; } }

.servicelist .item .option { margin-top: 40px; }

@media only screen and (max-width: 768px) { .servicelist .item .option { text-align: left; } }

.servicelist .item .option ul { display: inline-block; }

.servicelist .item .option ul li { float: left; list-style: none; text-decoration: none; border: 1px solid #003366; color: #003366; background: #fcee21; padding: 7px 15px 6px; font-size: 1rem; font-family: "M PLUS 1p", sans-serif; letter-spacing: -0.5px; margin-bottom: 20px; -webkit-transition: 0.4s; transition: 0.4s; font-weight: bold; }

.servicelist .item .option ul li:not(:last-child) { margin-right: 15px; }

@media only screen and (max-width: 768px) { .servicelist .item .option ul li { text-align: center; } }

.plan { display: block; }

@media only screen and (max-width: 768px) { .plan { padding: 0 20px; -webkit-transition: 0.4s; transition: 0.4s; } }

.plan .inner { position: relative; display: block; overflow-x: scroll; white-space: nowrap; -webkit-overflow-scrolling: touch; }

.plan .inner::-webkit-scrollbar { height: 10px; }

.plan .inner::-webkit-scrollbar-track { background: #f6f6f6; }

.plan .inner::-webkit-scrollbar-thumb { background: #c2c2c2; }

.plan th, .plan td { border: solid 1px; border-width: 0 1px 1px 0; font-weight: normal; text-align: left; padding: 0.5em 0.5em; white-space: nowrap; }

.plan th:last-child, .plan td:last-child { border-right: 0; }

.plan th { vertical-align: middle; text-align-last: left; font-size: 0.9375rem; white-space: nowrap; }

.plan td { vertical-align: middle; text-align: center; font-size: 0.875rem; }

.plan table { width: 100%; border-collapse: collapse; margin-bottom: 5px; }

.plan table.col4 tr:first-child td { width: calc(100% - 10em / 3); }

.plan table.col3 { width: 100%; }

.plan table.col3 tr:first-child td { width: calc(100% - 10em / 2); }

.plan table.col2 { width: 100%; }

.plan table.col2 tr:first-child td { width: calc(100% - 10em); }

.plan .price { font-size: 0.875rem; line-height: 1.6; }

.plan .price span { font-weight: 600; font-size: 1.375rem; letter-spacing: -1px; display: block; }

.plan em { font-style: normal; font-weight: bold; }

.plan tr:first-child th { width: 10em; }

.plan tr:first-child th, .plan tr:first-child td { border-top-width: 1px; }

.plan tr:first-child td { font-size: 1.375rem; }

.plan .nestth { padding-left: 7em; }

.caption { font-size: 0.9375rem; padding-top: 8px; text-align: left; margin-bottom: 45px; }

.table_caption { font-size: 0.9375rem; padding-top: 8px; text-align: right; margin-bottom: 45px; }

/************************************ scroll table start */
.btn { margin: 40px auto; text-align: center; }

@media only screen and (max-width: 768px) { .btn { text-align: center; } }

.btn a { display: inline-block; text-decoration: none; border: 1px solid #003366; color: #ffffff; background: #003366; padding: 7px 1em 6px; font-size: 1.3125rem; font-family: "M PLUS 1p", sans-serif; letter-spacing: -0.5px; margin-bottom: 20px; -webkit-transition: 0.4s; transition: 0.4s; }

.btn a:hover { border: 1px solid #003366; color: #003366; background: #ffffff; }

@media only screen and (max-width: 768px) { .btn a { font-size: 1rem; width: 80%; text-align: center; } }

#PageTopBtn { position: fixed; bottom: 50px; right: 30px; z-index: 9; }

@media only screen and (max-width: 768px) { #PageTopBtn { bottom: 20px; right: 20px; } }

#PageTopBtn a { display: block; text-decoration: none; outline: none; }

#PageTopBtn a img { width: 60px; height: 127px; -webkit-transition: 0.4s; transition: 0.4s; }

@media only screen and (max-width: 768px) { #PageTopBtn a img { width: 40px; height: 84px; -webkit-transition: 0.4s; transition: 0.4s; } }

#PageTopBtn a:hover { text-decoration: none; }

#PageTopBtn a:hover img { margin-top: -10px; -webkit-transition: 0.4s; transition: 0.4s; }

@media (min-width: 768px) { #PageTopBtn { font-size: 13px; }
  #PageTopBtn a { width: 60px; height: 130px; } }

@media (max-width: 767px) { #PageTopBtn { font-size: 10px; }
  #PageTopBtn a { width: 40px; height: 84px; } }

.main_inner { text-align: center; width: 980px; margin: 0 auto; }

@media only screen and (max-width: 768px) { .main_inner { width: 100%; } }

.main_inner h2 { font-size: 3.75rem; font-family: "Renner*"; font-weight: 500; line-height: 1; margin-bottom: 5px; }

@media only screen and (max-width: 768px) { .main_inner h2 { font-size: 2.125rem; text-align: left; width: 90%; margin: 0 auto; } }

.main_inner h2 + p { font-size: 1.375rem; font-weight: 700; font-family: "M PLUS 1p", sans-serif; line-height: 1; margin-bottom: 40px; }

@media only screen and (max-width: 768px) { .main_inner h2 + p { font-size: 1rem; text-align: left; width: 90%; margin: 0 auto 20px; } }

.main_inner h3 { font-size: 1.875rem; font-family: "M PLUS 1p", sans-serif; margin-bottom: 50px; }

@media only screen and (max-width: 768px) { .main_inner h3 { font-size: 1.25rem; text-align: left; width: 90%; margin: 0 auto 25px; }
  .main_inner h3 + .read p { text-align: left; width: 90%; margin: 0 auto 25px; } }

.main_inner ul, .main_inner li { list-style: none; }

.main_inner img { vertical-align: bottom; }

.main_inner .whatsdiystudio { margin-bottom: 50px; }

.main_inner .whatsdiystudio p { width: 610px; margin: 0 auto; }

@media only screen and (max-width: 768px) { .main_inner .whatsdiystudio p { width: 70%; } }

.main_inner .whatsdiystudio ul { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.main_inner .read p { font-size: 1.25rem; line-height: 1.8; margin-bottom: 1.5em; }

@media only screen and (max-width: 768px) { .main_inner .read p { font-size: 1rem !important; text-align: left; width: 90%; margin: 0 auto 1em; } }

.main_inner #access { margin-top: -70px; /* 固定ナビの高さ分のネガティブマージン */ padding-top: 70px; /* 打ち消し用のパディング */ }

.main_inner .sec { margin-bottom: 100px; }

@media only screen and (max-width: 768px) { .main_inner .sec { margin: 0 auto 50px; } }

.main_inner .rentalsharespace .spacemap { width: 800px; margin: 0 auto 40px; }

@media only screen and (max-width: 768px) { .main_inner .rentalsharespace .spacemap { width: 90%; margin: 0 auto 40px; } }

.main_inner .rentalsharespace .spacelist { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; background: #fcee21; width: 795px; padding: 7px 0; margin-bottom: 30px; }

@media only screen and (max-width: 768px) { .main_inner .rentalsharespace .spacelist { width: calc(100% - 10%); text-align: center; margin-bottom: 15px; } }

.main_inner .rentalsharespace .spacelist li { line-height: 1; }

.main_inner .rentalsharespace .spacelist li:not(:last-child) { border-right: 3px solid #003366; }

.main_inner .rentalsharespace .spacelist li a:link, .main_inner .rentalsharespace .spacelist li a:visited { font-size: 1.75rem; font-family: "Renner*"; font-weight: 500; color: #003366; margin: 0 0.5em; padding: 0 0.5em; }

@media only screen and (max-width: 768px) { .main_inner .rentalsharespace .spacelist li a:link, .main_inner .rentalsharespace .spacelist li a:visited { font-size: 0.8157rem; margin: 0 0.25em; padding: 0 0.25em; } }

.main_inner .rentalsharespace .spacelist li a:hover { text-decoration: none; }

.chart { width: 980px; margin: 0 auto; }

@media only screen and (max-width: 768px) { .chart { width: 90%; margin: 0 auto; } }

.chart .sponly { text-align: center; }

@media only screen and (max-width: 768px) { .chart .sponly { display: block; } }

.chart .sponly img { width: 100%; margin: 0 auto; }

.chart .pconly { width: 100%; }

.chart .pconly ul { display: none; }

.chart h4 { margin-bottom: 5px; }

@media only screen and (max-width: 768px) { .chart h4 { margin-bottom: 15px; } }

.chart img { width: 100%; }

.chart ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }

@media only screen and (max-width: 768px) { .chart ul { display: block; width: 100%; } }

.chart ul li { list-style: none; width: calc(25% - 35px); font-size: 0.75rem; line-height: 1.8; }

@media only screen and (max-width: 768px) { .chart ul li { width: 100%; clear: both; font-size: 0.75rem; margin-bottom: 20px; text-align: center; }
  .chart ul li:after { content: ""; display: block; clear: both; }
  .chart ul li img { width: 30%; } }

iframe { width: 100%; }

@media only screen and (max-width: 768px) { iframe { width: calc(100% - 10%); text-align: center; margin-bottom: 15px; } }

.contact { /* -------------------------------- 
Form
-------------------------------- */ /* ラジオボタン */ /* -------------------------------- 

step

-------------------------------- */ }

.contact h3 { margin-bottom: 10px; }

.contact .contact-rayout { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 760px; margin: 0 auto; }

@media only screen and (max-width: 768px) { .contact .contact-rayout { display: block; width: 90%; padding: 0; } }

.contact .contact-rayout .col2 { width: calc(50% - 10px); }

@media only screen and (max-width: 768px) { .contact .contact-rayout .col2 { width: 100%; text-align: left; }
  .contact .contact-rayout .col2 .textarea { margin-bottom: 20px; } }

.contact .contact-rayout .col-full { text-align: left; padding: 0 0px; }

@media only screen and (max-width: 768px) { .contact .contact-rayout .col-full { width: 100%; padding: 0; } }

.contact .btnwrap { margin: 20px 0; }

.contact .btnwrap input { margin: 10px; }

.contact .form-attention { color: #e32259; text-align: left; width: 760px; margin: 0 auto 10px; }

@media only screen and (max-width: 768px) { .contact .form-attention { width: 90%; padding: 0; } }

.contact .mw_wp_form .error { font-size: 93%; color: #e32259; display: block; text-align-last: left; margin-top: -1em; margin-bottom: 1em; }

.contact .cp_ipselect .error { right: 55px; }

.contact .confirmonly { display: none; }

.contact .mw_wp_form_confirm .contact-rayout { text-align: left; display: block; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 480px; margin: 0 auto; }

@media only screen and (max-width: 768px) { .contact .mw_wp_form_confirm .contact-rayout { width: 100%; padding: 0; } }

.contact .mw_wp_form_confirm .confirmonly { display: block; }

.contact .mw_wp_form_confirm .confirmonly_noview { display: none; }

.contact .mw_wp_form_confirm .req { display: block; text-align: left; margin-bottom: 20px; }

.contact .mw_wp_form_confirm .req:after { display: none; }

.contact .mw_wp_form_confirm .cp_ipselect.cp_sl01 { border: none; }

.contact .mw_wp_form_confirm .cp_ipselect.cp_sl01:before { display: none; }

.contact .mw_wp_form_confirm p { text-align: left; display: inline-block; }

.contact .mw_wp_form_confirm .col-full { width: 100%; padding: 0; text-align: left; }

.contact .mw_wp_form_confirm .textarea { margin-bottom: 20px; }

.contact .mw_wp_form .horizontal-item { margin-left: 0; display: inline-block; width: 240px; font-size: 0.9375rem; }

.contact .mw_wp_form .horizontal-item + .horizontal-item { margin-left: 0; }

.contact input, .contact button, .contact textarea, .contact select { -webkit-appearance: none; -moz-appearance: none; appearance: none; }

.contact input, .contact button, .contact textarea, .contact select { margin: 0; padding: 0; background: none; border: none; border-radius: 0; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; }

.contact .pageheader { margin-bottom: 50px; }

.contact #content { margin: 0 auto; width: 980px; text-align: center; margin-bottom: 70px; -webkit-transition: 0.4s; transition: 0.4s; }

@media only screen and (max-width: 768px) { .contact #content { width: 90%; margin: 0 auto 40px; -webkit-transition: 0.4s; transition: 0.4s; } }

.contact #content .read { margin-bottom: 20px; line-height: 1.6; font-size: 1.125rem; }

.contact input.sysNextSubmit { background: #003366; border: 1px solid #003366; color: #fff; font-size: 1.125rem; padding: 5px 30px; -webkit-transition: 0.4s; transition: 0.4s; }

.contact input.sysNextSubmit:hover { background: #ffffff; border: 1px solid #003366; color: #003366; font-size: 1.125rem; padding: 5px 30px; -webkit-transition: 0.4s; transition: 0.4s; }

.contact input[type="text"], .contact input[type="email"] { border: 0; padding: 10px 30px 10px 10px; font-size: 1rem; font-family: Arial, sans-serif; color: #003366; border: solid 1px #003366; margin: 0 0 20px; width: calc(100% - 0px); }

@media (max-width: 768px) { .contact input[type="text"], .contact input[type="email"] { width: calc(100% - 0px); } }

.contact textarea { border: 0; padding: 10px 30px 10px 10px; font-size: 1rem; font-family: Arial, sans-serif; color: #003366; border: solid 1px #003366; margin: 0 0 20px; width: calc(100% - 0px); }

@media (max-width: 768px) { .contact textarea { width: calc(100% - 0em); } }

.contact .cp_ipselect { overflow: hidden; width: calc(100% - 40px); margin: 0 0 20px; text-align: center; }

@media (max-width: 768px) { .contact .cp_ipselect { width: 100%; } }

.contact .cp_ipselect select { font-size: 1rem; width: 100%; padding-right: 1em; cursor: pointer; text-indent: 0.01px; text-overflow: ellipsis; border: none; outline: none; background: transparent; background-image: none; -webkit-box-shadow: none; box-shadow: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; }

.contact .cp_ipselect select::-ms-expand { display: none; }

.contact .cp_ipselect.cp_sl01 { position: relative; border: 1px solid #003366; background: #ffffff; width: calc(100% - 0px); margin-bottom: 14px; }

.contact .cp_ipselect.cp_sl01::before { position: absolute; top: 1em; right: 0.7em; width: 0; height: 0; padding: 0; content: ""; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 6px solid #003366; pointer-events: none; }

.contact .cp_ipselect.cp_sl01 select { padding: 7px 40px 7px 10px; color: #666666; }

.contact label { position: relative; display: inline-block; padding: 3px 3px 3px 13px; margin-bottom: 5px; cursor: pointer; }

.contact label:before, .contact label:after { position: absolute; left: 0; top: 0.45em; content: ""; }

.contact label:before { width: 11px; height: 11px; background: #fff; border: 2px solid #ccc; }

.contact label:after { display: inline-block; background-image: url(../images/check.png); background-position: 0 0; background-repeat: no-repeat; height: 12px; width: 13px; text-indent: 200%; white-space: nowrap; overflow: hidden; left: 2px; opacity: 0; z-index: 10; -webkit-transform: translate(2px, 0px) rotate(-20deg) scale(1.3); transform: translate(2px, 0px) rotate(-20deg) scale(1.3); -webkit-transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1); transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1); -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%; }

.contact input[type="checkbox"]:checked + label:after, .contact label.checked:after { opacity: 1; -webkit-transform: translate(0px, 0px) rotate(0deg) scale(1); transform: translate(0px, 0px) rotate(0deg) scale(1); }

.contact .req { position: relative; display: inline-block; }

.contact .req:after { content: "※"; display: block; position: absolute; right: 15px; top: 9px; color: #e32259; }

.contact .cp_ipselect:after { right: 30px; }

.contact .step { list-style-type: none; display: table; width: 60%; padding: 0; margin: 0 auto 30px; overflow: hidden; }

@media only screen and (max-width: 768px) { .contact .step { width: 100%; padding: 0; } }

.contact .step li { display: table-cell; position: relative; background: #999; padding: 0.5em 0.5em 0.5em 2em; color: #fff; }

.contact .step li:last-child { padding-right: 1em; }

.contact .step li:last-child:before, .contact .step li:last-child:after { display: none; }

.contact .step li:before, .contact .step li:after { content: ""; position: absolute; width: 0; height: 0; margin: auto; }

.contact .step li:before { top: -15px; right: -1em; border-style: solid; border-color: transparent transparent transparent #fff; border-width: 35px 0 35px 1em; z-index: 10; }

.contact .step li:after { top: -15px; right: -0.8em; border-style: solid; border-color: transparent transparent transparent #999; border-width: 35px 0 35px 1em; z-index: 10; }

.contact .step li.is-current { background: #003366; font-weight: bold; }

.contact .step li.is-current:after { border-color: transparent transparent transparent #003366; }

/* ///////////////////////////
article
///////////////////// */
.article-content { margin-bottom: 2rem; text-align: left; }

.article-content .article-info { margin-bottom: 0.5rem; }

.article-content .cat-data a { font-size: 0.8rem; margin-right: 0.5rem; padding: 0.1rem 0.5rem; text-decoration: none; color: #fff; background-color: #03162f; }

.article-content .article-info .article-date, .article-content .article-info .article-author { font-size: 0.8rem; display: inline-block; margin-right: 0.5rem; color: #888; }

.article-content .article-info .article-author i { margin-right: 0.3rem; }

.article-content p, .article-content b, .article-content table, .article-content ul, .article-content ol { font-size: 1rem; line-height: 1.7; letter-spacing: 1px; }

.article-content p, .article-content img, .article-content table, .article-content ul, .article-content ol { margin-bottom: 2rem; }

.article-content h1 { font-size: 1.9rem; margin: 0 0 2rem; letter-spacing: 1px; }

.article-content h2 { font-size: 1.7rem; margin: 3rem 0 2rem; padding: 0.4rem 0; letter-spacing: 1px; border-bottom: solid 5px #03162f; }

.article-content h3 { font-size: 1.5rem; margin: 2.5rem 0 1.8rem; padding: 0 1rem; letter-spacing: 1px; border-left: solid 7px #415671; background: transparent; }

.article-content h4 { font-size: 1.3rem; margin: 2rem 0 1rem; letter-spacing: 1px; }

.article-content h5 { font-size: 1.1rem; margin: 0 0 0.3rem; letter-spacing: 1px; }

.article-content .article-img { margin-bottom: 2rem; }

.article-content .article-img img { display: block; margin: 0 auto; }

.article-content ul { margin-left: 2rem; list-style: disc; }

.article-content ol { margin-left: 2rem; list-style: decimal; }

.article-content table { border-collapse: collapse; }

.article-content th, .article-content td { padding: 0.6rem; vertical-align: middle; border: 1px solid #ddd; }

.article-content figure { max-width: 100%; }

.article-tag { text-align: right; }

.article-tag ul { font-size: 0; margin-bottom: 0; }

.article-tag ul li { font-size: 0.9rem; display: inline-block; margin-right: 0.5rem; vertical-align: middle; }

.article-tag ul li:last-child { margin-right: 0; }

.article-tag ul li a { padding: 0.2rem 0.5rem; text-decoration: none; color: #000; border: 1px solid #000; }

.article-tag ul li a:hover { opacity: 0.6; }

.scwrap { -webkit-box-sizing: border-box; box-sizing: border-box; color: #fff; font-size: 5rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 400px; width: 100%; margin-bottom: 50px; -webkit-transition: 0.4s; transition: 0.4s; }

@media only screen and (max-width: 768px) { .scwrap { display: none; height: 0; -webkit-transition: 0.4s; transition: 0.4s; } }

.parallax-bg { background-attachment: fixed; background-repeat: no-repeat; background-size: cover; height: 100%; width: 100%; }

.parallax-bg:after { content: ""; display: block; height: 200px; }

/*各背景の画像*/
.img-bg-01 { background-image: url("../images/home_p01.jpg"); }

.img-bg-02 { background-image: url("../images/home_p02.jpg"); }

/* ヘッダ固定 */
.head-sticky { position: -webkit-sticky; /* Safari */ position: sticky; top: 0; }

#main .handson-top { margin-bottom: 35px; }

#main .item_inner { position: relative; height: 380px; }

#main .item_inner .item_header { text-align: left; position: absolute; bottom: 10px; left: 20px; right: 20px; z-index: 99999; color: #ffffff; font-size: 1.5rem; font-weight: bold; font-family: "M PLUS 1p", sans-serif; line-height: 1.2; }

#main .item_inner .item_header .ttl { color: #ffffff; }

#main .item_inner .item_header time { font-size: smaller; }

#main .swiper-button-next, #main .swiper-container-rtl .swiper-button-prev { background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22iso-8859-1%22%3F%3E%3Csvg%20version%3D%221.1%22%20id%3D%22%26%23x30EC%3B%26%23x30A4%3B%26%23x30E4%3B%26%23x30FC%3B_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2030.048%2055.44%22%20style%3D%22enable-background%3Anew%200%200%2030.048%2055.44%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cg%3E%20%3Cg%3E%20%3Cpolygon%20style%3D%22fill%3A%23FFFFFF%3B%22%20points%3D%222.121%2C55.44%200%2C53.319%2025.806%2C27.513%200.413%2C2.121%202.534%2C0%2030.048%2C27.513%20%22%2F%3E%20%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E"); }

#main .swiper-button-prev, #main .swiper-container-rtl .swiper-button-next { background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22iso-8859-1%22%3F%3E%3Csvg%20version%3D%221.1%22%20id%3D%22%26%23x30EC%3B%26%23x30A4%3B%26%23x30E4%3B%26%23x30FC%3B_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2030.048%2055.44%22%20style%3D%22enable-background%3Anew%200%200%2030.048%2055.44%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cg%3E%20%3Cg%3E%20%3Cpolygon%20style%3D%22fill%3A%23FFFFFF%3B%22%20points%3D%2227.927%2C55.44%2030.048%2C53.319%204.242%2C27.513%2029.635%2C2.121%2027.514%2C0%200%2C27.513%20%22%2F%3E%20%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E"); }

#main .image { width: 100%; display: block; margin: 0; position: relative; z-index: 2; overflow: hidden; }

#main .image img { width: 100%; height: 380px; -o-object-fit: cover; object-fit: cover; -webkit-transition: transform 0.75s ease; -webkit-transition: -webkit-transform 0.75s ease; transition: -webkit-transform 0.75s ease; transition: transform 0.75s ease; transition: transform 0.75s ease, -webkit-transform 0.75s ease; }

#main .image img:hover { -webkit-transform: scale(1.2); transform: scale(1.2); }

#main .event .event_wrapper { margin-bottom: 40px; }

#main .event .event_wrapper .ttl { color: #ffffff; text-shadow: 0px 0px 4px #003366; }

#main .news { margin-bottom: 80px; }

@media only screen and (max-width: 768px) { #main .news { width: auto; margin: 0 5%; } }

#main .news h2 { margin-bottom: 20px; }

@media only screen and (max-width: 768px) { #main .news h2 { width: 100%; } }

#main .news .newsinner { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; font-family: "Sawarabi Gothic", sans-serif; }

@media only screen and (max-width: 768px) { #main .news .newsinner { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } }

#main .news .newsinner .item { width: 235px; margin-bottom: 20px; margin-right: 13px; }

#main .news .newsinner .item:last-child { margin-right: 0; }

@media only screen and (max-width: 768px) { #main .news .newsinner .item { width: 48%; margin-right: 0; }
  #main .news .newsinner .item:nth-child(2n) { margin-left: 10px; } }

#main .news .newsinner .item .item_inner { height: auto; }

#main .news .newsinner .item .item_inner a:link, #main .news .newsinner .item .item_inner a:visited { text-decoration: none; color: #003366; }

#main .news .newsinner .item .item_inner a:hover { text-decoration: underline; color: #003366; }

#main .news .newsinner .item .item_inner .image { width: 235px; height: 235px; border: 2px solid #003366; }

@media only screen and (max-width: 768px) { #main .news .newsinner .item .item_inner .image { width: 100%; height: auto; } }

#main .news .newsinner .item .item_inner .image img { height: auto; }

#main .news .newsinner .item .item_inner .item_header { position: relative; display: block; color: inherit; bottom: auto; left: auto; right: auto; }

#main .news .newsinner .item .item_inner .item_header time { font-size: 0.625em; color: #003366; margin-bottom: 10px; display: inline-block; }

#main .news .newsinner .item .item_inner .item_header .ttl { font-size: 0.9375rem; color: #003366; }

#main .news .more { text-align: right; margin-bottom: 40px; }

#main .news .more a { display: inline-block; background: #fcee21; font-size: 0.625em; color: #003366; font-weight: bold; padding: 5px; text-decoration: none; }

.category .main_inner #content { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }

@media only screen and (max-width: 768px) { .category .main_inner #content { -ms-flex-wrap: wrap; flex-wrap: wrap; } }

.category .main_inner #content .news { width: 730px; }

@media only screen and (max-width: 768px) { .category .main_inner #content .news { width: 100%; margin: 0 10%; } }

.category .main_inner #content .news .newsinner { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; }

.category .main_inner #content .news .newsinner .item { margin-right: 10px; }

@media only screen and (max-width: 768px) { .category .main_inner #content .news .newsinner .item { margin-right: 0px; } }

.category .main_inner #content .news .newsinner .item:nth-child(3n) { margin-right: 0; }

@media only screen and (max-width: 768px) { .category .main_inner #content .news .newsinner .item:nth-child(3n) { margin-right: 10px; } }

.category .main_inner #content #sub { text-align: left; width: 220px; }

@media only screen and (max-width: 768px) { .category .main_inner #content #sub { width: 90%; margin: 0 auto; } }

.category .main_inner #content #sub h3 { font-size: 1rem; margin-bottom: 5px; position: relative; }

@media only screen and (max-width: 768px) { .category .main_inner #content #sub h3 { width: 100%; margin: 0 auto; } }

.category .main_inner #content #sub h3:after { position: absolute; bottom: 1px; z-index: -1; left: 0; content: ""; width: 100%; height: 2px; background: #003366; }

.category .main_inner #content #sub aside { margin-bottom: 30px; }

.category .main_inner #content #sub aside li { padding: 5px 20px; }

.category .main_inner #content #sub aside a:link, .category .main_inner #content #sub aside a:visited { color: #003366; }

.below .post { max-width: 970px; margin: 0 auto; background: #ffffff; padding: 0 50px 50px; }

@media only screen and (max-width: 768px) { .below .post { padding: 0 00px 20px; } }

.below .post h1 { font-size: 30px; font-size: 3vw; line-height: 1.6; margin-bottom: 50px; }

@media only screen and (max-width: 768px) { .below .post h1 { font-size: 5vw; margin-bottom: 10px; } }

.below .post .rimage { text-align: center; }

.below .post .image { max-width: 870px; margin: 0 auto; margin-bottom: 2vw; }

.below .post .image img { width: 100%; }

.below .post p { font-size: 1.14285714em; display: block; font-family: "Sawarabi Gothic", sans-serif; font-weight: 100; line-height: 2; margin: 0.8em 0; }

@media only screen and (max-width: 768px) { .below .post p { font-size: 3vw; } }

.below .post h2 { position: relative; padding-left: 0.4em; font-size: 1.7rem; padding: 0; margin: 1em 0 1em; z-index: 1; }

@media only screen and (max-width: 768px) { .below .post h2 { font-size: 1.125rem; } }

.below .post h2:after { content: ""; display: block; position: absolute; right: 0; bottom: 0; height: 0.8em; background: #f0f5f5; width: 100%; z-index: -1; border: none; margin-top: 0; }

.below .post h3 { font-size: 1.7rem; color: #2292ab; margin-top: 2em; margin-bottom: 0.7em; line-height: 1.5; counter-increment: subcounter; position: relative; }

@media only screen and (max-width: 768px) { .below .post h3 { font-size: 1.3125rem; } }

.below .post h3:after { content: ""; display: block; border-bottom: solid 3px #f0f5f5; margin-top: 0.3em; }

.below .post h4 { font-family: "Sawarabi Gothic", sans-serif; font-weight: 200; font-style: italic; color: #1b1922; font-size: 18px; font-size: 1rem; }

.below .post ul, .below .post ol { border: 3px solid #f0f5f5; padding: 1em 2em; margin: 2em 0; background-color: rgba(255, 255, 255, 0.5); }

.below .post ul li, .below .post ol li { position: relative; padding-left: 1.5em; line-height: 1.7; margin: 0.5em 0; }

.below .post ul li:before, .below .post ol li:before { content: "-"; -webkit-transform: rotateX(-0.001deg); transform: rotateX(-0.001deg); margin-right: 0.5em; color: #2292ab; position: absolute; top: 0; left: 0; }

.below .post .sec { margin-bottom: 45px; border-bottom: 1px dotted #977; padding-bottom: 60px; }

.below .post .post-date { text-align: right; padding-top: 80px; }

.below .post .post-nav { margin: 40px 0 50px; padding: 40px 0; border-top: 1px dotted #977; border-bottom: 1px dotted #977; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; font-family: "Sawarabi Gothic", sans-serif; font-size: 1.4vw; }

.below .post .post-nav a { text-decoration: none; }

.below .post .post-nav .post-prev { text-align: left; width: 100%; font-size: 1rem; }

.below .post .post-nav .post-next { text-align: right; width: 100%; font-size: 1rem; }

.below .post .aligncenter { margin-left: auto; margin-right: auto; display: table; }

.below .post .gallery-columns-2 { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 20px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

@media only screen and (max-width: 768px) { .below .post .gallery-columns-2 { margin-bottom: 0px; } }

@media only screen and (max-width: 768px) { .below .post .gallery-columns-2 .gallery-item { width: calc(50% - 5px); } }

.below .post .gallery-columns-2 .gallery-item:nth-child(even) { margin-left: 5px; }
/*# sourceMappingURL=diystudio.css.map */