html {font-family: sans-serif;-ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%}html,body {overflow-x: hidden;width: 100%;}body {margin: 0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary {display: block}audio,canvas,progress,video {display: inline-block;vertical-align: baseline}audio:not([controls]) {display: none;height: 0}[hidden],template {display: none}a {background-color: transparent}a:active,a:hover {outline: 0}b,strong {font-weight: 700}small {font-size: 80%}img {border: 0}svg:not(:root) {overflow: hidden}figure {margin: 1em 40px}button,input,optgroup,select,textarea {color: inherit;font: inherit;margin: 0}button {overflow: visible}button,select {text-transform: none}button,html input[type=button],input[type=reset],input[type=submit] {-webkit-appearance: button;cursor: pointer}button[disabled],html input[disabled] {cursor: default}button::-moz-focus-inner,input::-moz-focus-inner{border: 0;padding: 0}input {line-height: normal}input[type=checkbox],input[type=radio] {box-sizing: border-box;padding: 0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button {height: auto}input[type=search] {-webkit-appearance: textfield;-moz-box-sizing: content-box;-webkit-box-sizing: content-box;box-sizing: content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration {-webkit-appearance: none}textarea {overflow: auto}table {border-collapse: collapse;border-spacing: 0}td,th {padding: 0}
/*=====================*/
@font-face {font-family: 'icomoon';src: url('../fonts/icomoon.eot?z5re0x');src: url('../fonts/icomoon.eot?z5re0x#iefix') format('embedded-opentype'),url('../fonts/icomoon.ttf?z5re0x') format('truetype'),url('../fonts/icomoon.woff?z5re0x') format('woff'),url('../fonts/icomoon.svg?z5re0x#icomoon') format('svg');font-weight: 900;font-style: normal;}[class^="icon-"], [class*=" icon-"] {font-family: 'icomoon' !important;speak: none;font-style: normal;font-weight: bolder;font-variant: normal;text-transform: none;line-height: 1;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;vertical-align: middle;font-size: larger;}
.icon-heart:before {content: "\e90f";}
.icon-que:before {content: "\e910";}
.icon-taxi:before {content: "\e911";}
.icon-man:before {content: "\e912";}
.icon-books:before {content: "\e913";}
.icon-airplan:before {content: "\e900";}
.icon-ballon:before {content: "\e901";}
.icon-book:before {content: "\e902";}
.icon-check:before {content: "\e903";}
.icon-clip:before {content: "\e904";}
.icon-clock:before {content: "\e905";}
.icon-coffee:before {content: "\e906";}
.icon-flag:before {content: "\e907";}
.icon-glasses:before {content: "\e908";}
.icon-hands:before {content: "\e909";}
.icon-logo:before {content: "\e90a";}
.icon-mail:before {content: "\e90b";}
.icon-memo:before {content: "\e90c";}
.icon-search:before {content: "\e90d";}
.icon-smp:before {content: "\e90e";}
/*=====================*/
body {font-family: "Century Gothic", CenturyGothic,'ヒラギノ角ゴシック Pro','Hiragino Kaku Gothic Pro',游ゴシック体,'Yu Gothic',YuGothic,メイリオ,Meiryo,Osaka,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;font-weight: normal;font-size: 16px;background: #fefef4;}
/*=====================*/
ul, ol { margin: 0; padding: 0;}ul li { list-style: none;}
img {border: 0; -ms-interpolation-mode: bicubic;max-width: 100%; height: auto; width :auto;}
/*=====================*/
.avatar {position: relative;z-index: 2;margin-top: -40px;text-align: center;}
.avatarM {position: relative;z-index: 2;margin: -10px auto 0;width: 150px;text-align: center;}
.avatarR {position: relative;z-index: 2;margin: -10px auto 0;text-align: center;}
/*=====================*/
.paA {padding: 10px 15px;}
.paB {padding: 30px 0!important;}
.paC {padding: 30px 15px;}
/*=====================*/
.bgW {background: white;border: dotted 3px #e6e6e6;padding: 5px 3px;margin: 20px 0;}
.bgW img{padding-bottom: 10px;}
/*=====================*/
.pagetop, .pagetopW {text-align: center;padding: 20px;clear: both;}
.pagetop a {color: #FF5274;}
/*=====================*/
a {color: #4cc7c2;text-decoration: none;-webkit-transition-timing-function: ease;transition-timing-function: ease;-webkit-transition-duration: 200ms;transition-duration: 200ms;}
a:hover, a:active, a:focus {color: #ff7676;text-decoration: none;}
i {padding-right: 10px;}
/*=====================*/
.radius {padding: 10px 15px; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; -o-border-radius: 10px; }
/*=====================*/
.ttl {text-align: center;font-size: 30px;font-weight: 800;vertical-align: middle;margin: 20px 0 10px;}
.ttl i {text-align: center;font-size: 50px;font-weight: 500;vertical-align: middle;}
.ttl02 {font-size: 18px;font-weight: 800;vertical-align: middle;margin: 20px 0 10px;}
.ttl02 i {font-size: 40px;font-weight: 500;vertical-align: middle;}
.ttl03 {font-size: 16px;padding: 0 0 20px;font-weight: bold;line-height: 3rem;background: url(../img/line02.png) bottom left repeat-x;}
.ttl03 strong {font-size: 20px;vertical-align: middle;margin: 20px 0 10px;}
.ttl04 {text-align: center;font-size: 30px;font-weight: 800;margin: 20px 0 30px;padding-bottom:15px;background: url("../img/line.png") repeat-x bottom left;}
.ttl04 i {text-align: center;font-size: 40px;font-weight: 500;display: block;padding-bottom: 10px;}
.ttl05 {text-align: center;font-size: 20px;font-weight: 800;margin: 10px 0 30px;}
.ttl05 i {text-align: center;font-size: 50px;font-weight: 500;display: block;padding-bottom: 10px;}
.ttl06 {font-size:18px;font-weight: 800;margin: 10px 0 30px;background: url(../img/line03.jpg) no-repeat bottom left;padding-bottom: 20px;}
.ttl06 i {font-size:18px;padding-right: 3px;}
.ttl07 {text-align: center;font-size: 18px;font-weight: 800;margin: 10px 0;background: url(../img/line02.png) repeat-x bottom left;padding-bottom: 20px;}
.ttl07 i {text-align: center;font-size: 30px;font-weight: 500;display: block;padding-bottom: 10px;}
.ttl08 {text-align: center;font-size: 18px;font-weight: 500;margin: 10px 0;padding-bottom: 20px;}
.ttl08 span{text-align: center;font-size: 22px;font-weight: 800;margin: 10px 0;padding-bottom: 20px;}
.ttl09 {border-bottom: dotted 3px #e6e6e6;text-align: center;font-size: 18px;font-weight: 800;margin: 10px;padding: 10px 0;}
.ttl10 {text-align: center;font-size: 20px;font-weight: bold;padding: 0;line-height: 2.5rem;background:white;border: 3px solid #e6e6e6;padding: 15px 5px;}
.ttl10 span {font-size: 16px;font-weight: normal;display: block;border-bottom: 3px dotted #e6e6e6;}
.ttl10 strong {font-size: 20px;font-weight: bold;display: block;padding: 5px;color: #ff7676;}
.ttl10 b {font-size: 45px;font-weight: bold;display: block;line-height: 5rem;}
/*=====================*/
.movArea {position: relativewidth: calc(100% - 10px); margin: 0 auto;}
.movArea .iframeWrap{height: 0;padding-bottom: 62.5%;}
.movArea .iframeWrap iframe {position: absolute;top: 0;left: 0;padding: 10px;}
/*=====================*/
.merit01 .ttl06 span {display: block;font-weight: normal;font-size: 16px;}
.merit01 .ttl06 b {font-size: 20px;line-height: 3.5rem;}
.merit01 div {padding-bottom: 20px;}
.meritTop strong {color: #FF5274;font-size: 20px;}
/*=====================*/
.cameraman {background: url("../img/line.png") repeat-x top left;}
.topCon02 .ttl04 i {padding-bottom: 30px;}
.topCon02 img {margin: 0 auto;display: block;padding-bottom: 10px;}
.award {margin:30px 0;}
.kyoryoku p {padding: 20px 0;}
.row {padding: 20px 0;}
/*=====================*/
.imgBtn {margin: 10px auto;-webkit-transition: all 0.3s ease;transition: all 0.3s ease;text-align: center;}
.imgBtn:hover, .imgBtn:active, .imgBtn:focus {opacity: 0.5;}
.photoBn {margin: 20px 0;padding: 10px;border-radius: 10px;}
.btn {font-size: 100%;display: inline-block;padding: 15px 30px;margin: 10px 0;-webkit-transition: all 0.3s ease;transition: all 0.3s ease;width: 100%;border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px;font-size: 18px;}
.btn02 {font-size: 100%;display: inline-block;padding: 10px 15px;margin-bottom: 10px;-webkit-transition: all 0.3s ease;transition: all 0.3s ease;width: 100%;border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px;}
.btn03 {font-size: 18px;display: inline-block;padding: 10px;margin-bottom: 10px;-webkit-transition: all 0.3s ease;transition: all 0.3s ease;width: 100%;border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px;text-align: center;}
.btn03 i {font-size: 50px;display: block;padding-bottom: 10px;font-weight: bold;}
.btn04 {font-size: 18px;display: inline-block;padding: 10px 20px;margin: 10px 0;-webkit-transition: all 0.3s ease;transition: all 0.3s ease;width: auto;border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px;text-align: center;}
.blue {background: #84ccc9;color: black;}
.blue:hover,.blue:focus {background: #ff7676;color: white;}
.btnO {background: #ffcea2;color: black;}
.btnO:hover,.btnO:focus {background: #ff7676;color: white;}
.btnW {background: white;color: black;border: 1px solid #ccc;font-size: 20px;}
.btnW:hover,.btnW:focus {background: #ff7676;color: white;}
/* Navigation */
.header-nav.open {visibility: visible;opacity: 0.9;-webkit-transition: opacity 0.5s;transition: opacity 0.5s; }
.navicon { position: absolute;right: 10px; top: 5px;visibility: hidden;-webkit-transition: all 300ms ease-in-out;transition: all 300ms ease-in-out;}
.navicon p {font-size: 12px;font-weight: 900; margin:35px 0 0 -10px;}
.nav-toggle {position: absolute;top: 0;right: 0;z-index: 999999;width: 70px;cursor: pointer;background: white;border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px;padding-left: 20px;}
.nav-toggle:focus,.nav-toggle:hover { outline: none;}
.nav-toggle span, .nav-toggle span:before, .nav-toggle span:after {content: ""; position: absolute;display: block; width: 30px; height: 4px; background: black; cursor: pointer;top: 18px;}
.nav-toggle span:before {top: -10px; }
.nav-toggle span:after {top: 10px; }
.nav-toggle span, .nav-toggle span:before, .nav-toggle span:after {-webkit-transition: all 300ms ease-in-out;transition: all 300ms ease-in-out; }
.nav-toggle.active span {background-color: transparent; }
.nav-toggle.active span:before, .nav-toggle.active span:after {top: 0; }
.nav-toggle.active span:before {-ms-transform: rotate(45deg);-webkit-transform: rotate(45deg);transform: rotate(45deg); }
.nav-toggle.active span:after { top: 10px;-ms-transform: translatey(-10px) rotate(-45deg); -webkit-transform: translatey(-10px) rotate(-45deg);transform: translatey(-10px) rotate(-45deg); }
.navigation {-webkit-transition: all 300ms ease-in-out;transition: all 300ms ease-in-out;width: 310px;z-index: 999; }
.modal-dialog {width: 100%;}
/* Header */
header {padding-top: 10px;position: relative;-webkit-transition: padding 300ms ease-in-out;transition: padding 300ms ease-in-out; }
header a {color: black;}
.logo-pc i {font-size: 80px;}
.logo-sp i {font-size: 50px;}
.logo-pc strong {font-size: 30px;display: block;}
.logo-sp strong {font-size: 18px;display: block;}
.logo-pc {text-align: center;font-size: 20px;padding-bottom: 25px;}
.logo-sp {display: none;}
header .header-nav {width: 300px;clear: both;}
header .primary-nav {width:99%;margin: 0 auto;border-top: 2px solid black;border-bottom: 2px solid black;}
header .primary-nav li {font-size: 17px;border-top: 3px dotted black;font-weight: 600;}
header .primary-nav li:first-child {border: none;}
header .primary-nav li span {background: #84ccc9; color: white;padding: 10px 0 10px 15px;display: inline-block;width:100%;}
header .primary-nav li a i {font-size: 30px;}
header .primary-nav li a {vertical-align: middle;padding: 10px 0 10px 15px;width:100%;display: inline-block;color: black;}
header .primary-nav li a:hover, header .primary-nav li a:focus {color: white;}
header .primary-nav li ul.rec02 {background:#ffd9a2;}
header .primary-nav li ul.rec02 li {border: none;font-size: 16px;}
header .primary-nav li ul.rec02 li a i {font-size: 14px;padding: 0 0 0 20px;}
header .primary-nav li a.home {background:#fdc592;}
header .primary-nav li a.rec {background:#ffcea2;}
header .primary-nav li a.com {background:#ffe6a2;}
header .primary-nav li a.ord {background:#fff6a2;}
header .primary-nav li a.home:hover,header .primary-nav li a.rec:hover,header .primary-nav li a.com:hover,header .primary-nav li a.ord:hover,header .primary-nav li ul.rec02 li a:hover {background:#84ccc9;}
.sideArea {width: 300px;margin:0 40px;float: left;}
.sideArea .bannerArea a { position: relative;z-index: 999;}
.contentArea {float: right;width: 100%;margin-left: -380px;}
.content {margin-left: 380px;max-width: 1000px;}
.bannerArea div {margin: 25px 0;width: 300px;}
.bannerArea div.recBn {background: url("../img/line.png") repeat-x top left;padding: 5px 0 0;}
.bannerArea div.recBn a {color: black;}
.bannerArea div.recBn a:hover,.bannerArea div.recBn a:focus {color: #ff7676;}
.bannerArea div.recBn img {display: block;margin: 0 auto;padding-bottom: 15px;}
.bannerAreaB {display: none;}
.slide {top: -50px;}
.sliTop {z-index: 999;width: 100%;position: relative;}
.sliTop img {display: block;margin: 0 auto;}
.sliPhoto {top: -20px;position: relative;}
.sliBtn a {clear:both;background: #84ccc9; text-align: right;display: inline-block;color: black;width: 100%;padding: 10px 20px;position: relative;
top: -50px;}
.sliBtn a:hover, .sliBtn a:focus {background: #f5b377;color: black;}
.mf div, .tp div {padding: 10px 15px; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; -o-border-radius: 10px;margin: 10px;}
.mf div {background: #84ccc9;}
.tp div {background: #fdc592;}
.phoneNumber {font-family: Century Gothic, sans-serif;font-weight: 600;font-size: 30px;text-align: center;line-height: 3rem;}
table .col-md-6{padding: 0;marign:0;}
/*パンくず*/
.panNav ol {list-style: none; clear: both;border-bottom:1px #E6E9EA dotted;overflow: auto;font-size: 14px;margin-bottom: 15px;}
.panNav ol li {float: left;padding: 5px 0 5px 18px;}
/*注意書き*/
.attn {background: #f3f7f9;padding: 15px;color: #1e85c3;margin: 10px 0;}
.attnW {background: white;padding: 10px;color: #ff7d7d;margin: 10px 0;border: #ccc 1px solid;}
form label {padding-bottom: 10px;margin:25px 0 5px;font-weight: bold;width: 100%;}
form label.det01 {padding-bottom: 10px;margin:25px 0 5px;font-weight: bold;border-bottom: 2px dotted #cfd8dc;}
.form-control {font-size: 18px;position: relative;left: 0;height: auto;padding: 20px 30px;border: 1px 0 1px;border-radius: 10px;box-shadow: 0;}
.radio-inline {padding-top: 10px;}
.radio-inline:hover {background: white;}
/*table*/
table {font-size: 16px;width:98%;line-height: 2.8rem;margin: 0 auto;}
table strong {font-size: 20px;color: #ef4242;}
table thead, table.listA th {background: #84ccc9;color: black;}
table tr {border-bottom: 1px #ccc solid;}
table th {padding: 5px 20px;font-weight: normal;font-size: 14px;width: 100px;}
table td {padding: 10px 20px;background: white;}
table th:first-child, table td:first-child {border: none;}
table img.ie9 {width:500px;}
.qa li {font-size: 18px;padding: 10px 0;}
.qa div {padding: 10px 0;background: url("../img/line.png") repeat-x top left;}
.club div {text-align: center;}
.club div, .interview .clearfix {margin-bottom: 40px;}
.flow .col-md-4 p {height: 100px;}
.policy h3 {margin: 25px 5px;}
.policy ul {margin: 15px 5px;}
.policy ul li {font-size:18px;padding: 10px 5px;}
.message div p {font-size: 20px;padding: 10px 5px;}
.message div span {font-size: 16px;padding: 10px 5px;text-align: right;display: block;}
.privacy h3 {margin: 50px 5px 5px}
.anotherWay {border: 1px solid #ccc;margin: 10px 5px;font-size: 18px;text-align: center;}
.anotherWay a {padding: 20px 10px;background: white;display: inline-block;width: 100%;}
.hatarakiyasui{border: solid 2px;padding: 30px;width: 90%;margin: 0 auto;background: #fff;margin-top: 20px;}
.hatarakiyasui-img{width: 30%;margin: 0 auto;}
.hatarakiyasui strong{color: #EE7C44;}
/* Footer */
footer {padding: 15px; overflow: auto;background: #84ccc9;border-top: 2px solid black;}
footer a {color: black;}
footer a:hover, footer a:active, footer a:focus {color: white;}
footer h1 {padding: 0 15px;vertical-align: middle;font-size: 16px;}
footer h1 i {vertical-align: middle;float: left;font-size:50px;}
footer h1 i span {vertical-align: middle;float: left;}
footer h1 strong {display: block;font-size: 18px;padding-top: 5px;}
footer h2 {font-size: 18px;padding-bottom: 5px;}
footer h2 i {font-size: 30px;}
footer ul li {padding: 3px 5px;}
footer .company {background: #dbf3f2;margin: 10px 0;border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; -o-border-radius: 10px;max-width: 350px;}
footer .company p {font-size: 14px;padding: 0 15px 5px;}
footer .company a {color: black;}
footer .credit {font-size: 12px;color:black;padding: 10px;text-align: center;background: url("../img/line.png") repeat-x top left;}
/**/
@font-face {
font-family: 'fontawesome';
src:url('../recruit/fonts/fontawesome/fontawesome.eot?-e43dk9');
src:url('../recruit/fonts/fontawesome/fontawesome.eot?#iefix-e43dk9') format('embedded-opentype'),
url('../recruit/fonts/fontawesome/fontawesome.woff?-e43dk9') format('woff'),
url('../recruit/fonts/fontawesome/fontawesome.ttf?-e43dk9') format('truetype'),
url('../recruit/fonts/fontawesome/fontawesome.svg?-e43dk9#fontawesome') format('svg');
font-weight: normal;
font-style: normal;
} /* Made with http://icomoon.io/app */
/* General style */
.grid-gallery ul {
list-style: none;
margin: 0;
padding: 0;
}
.grid-gallery div {
margin: 0;
}
.grid-gallery div img {
display: block;
width: 100%;
border-radius: 10px;
background: white;
}
/* Grid style */
.grid-wrap {
max-width: 69em;
margin: 0 auto;
}
.grid {
margin: 0 auto;
}
.grid li {
width: 25%;
float: left;
cursor: pointer;
}
.grid div {
padding: 10px;
-webkit-transition: opacity 0.2s;
transition: opacity 0.2s;
}
.grid li:hover img {
box-shadow: 0 10px 15px rgba(0,0,0,.5);-webkit-transition-timing-function: ease;transition-timing-function: ease;-webkit-transition-duration: 300ms;transition-duration: 300ms;
}
/* Slideshow style */
.slideshow {
position: fixed;
background: rgba(255,211,100,0.9);
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 9999999;
opacity: 0;
visibility: hidden;
overflow: hidden;
-webkit-perspective: 1000px;
perspective: 1000px;
-webkit-transition: opacity 0.5s, visibility 0s 0.5s;
transition: opacity 0.5s, visibility 0s 0.5s;
}
.slideshow-open .slideshow {
opacity: 1;
visibility: visible;
-webkit-transition: opacity 0.5s;
transition: opacity 0.5s;
}
.slideshow ul {
width: 100%;
height: 100%;
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: translate3d(0,0,150px);
transform: translate3d(0,0,150px);
-webkit-transition: -webkit-transform 0.5s;
transition: transform 0.5s;
}
.slideshow ul.animatable li {
-webkit-transition: -webkit-transform 0.5s;
transition: transform 0.5s;
}
.slideshow-open .slideshow ul {
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
}
.slideshow li {
width: 780px;
height: 560px;
position: absolute;
top: 50%;
left: 50%;
margin: -280px 0 0 -330px;
visibility: hidden;
}
.slideshow li.show {
visibility: visible;
}
.slideshow li:after {
content: '';
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
-webkit-transition: opacity 0.3s;
transition: opacity 0.3s;
}
.slideshow li.current:after {
visibility: hidden;
opacity: 0;
-webkit-transition: opacity 0.3s, visibility 0s 0.3s;
transition: opacity 0.3s, visibility 0s 0.3s;
}
.slideshow div {
width: 100%;
height: 100%;
overflow: hidden;
border-radius: 10px;
position: relative;
}
.slideshow li div img {
position: absolute;
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
left: 50%;
top: 50%;
-webkit-transform: translate3d(-50%, -50%, 0);
transform: translate3d(-50%, -50%, 0);
}
/* Navigation */
.slideshow nav span {
position: fixed;
z-index: 1000;
color: white;
text-align: center;
padding: 3%;
cursor: pointer;
font-size: 2.2em;
}
.slideshow nav span.nav-prev,
.slideshow nav span.nav-next {
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
text-shadow:0 3px 10px black;
}
.slideshow nav span.nav-next {
right: 0;
}
.slideshow nav span.nav-close {
top: 0;
right: 0;
padding: 0.5em 1em;
color: white;
}
.icon:before,
.icon:after {
font-family: 'fontawesome';
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
span.nav-prev:before {
content: "\e601";
}
span.nav-next:before {
content: "\e600";
}
span.nav-close:before {
content: "\e602";
}
@media screen and (max-width: 60em) {
/* responsive columns; see "Element sizing" on http://masonry.desandro.com/options.html */
.grid li {
width: 33.3%;
}
.slideshow li {
width: 100%;
height: 100%;
top: 0;
left: 0;
margin: 0;
}
.slideshow nav span,
.slideshow nav span.nav-close {
font-size: 1.8em;
padding: 0.3em;
}
.info-keys {
display: none;
}
}
@media screen and (max-width: 35em) {
.grid li {
width: 50%;
}
.slideshow div {
width: 90%;margin: 0 auto;
}
}
@media screen and (max-width: 24em) {
.grid li {
width: 100%;
}
}
/* ここから追記(2022.4.27) */
.comment{
display: flex;
margin-top: 40px;
margin-bottom: 40px;
}
.comment-inner{
width: calc(100% / 3);
}
.name{
font-size: 120%;
font-weight: bold;
}
.dn{
color: #fefef4;
}