@charset "UTF-8";
#baguetteBox-overlay{display:none;opacity:0;position:fixed;overflow:hidden;top:0;left:0;width:100%;height:100%;z-index:1000000;background-color:#222;background-color:rgba(0,0,0,.8);-webkit-transition:opacity .5s ease;transition:opacity .5s ease}#baguetteBox-overlay.visible{opacity:1}#baguetteBox-overlay .full-image{display:inline-block;position:relative;width:100%;height:100%;text-align:center}#baguetteBox-overlay .full-image figure{display:inline;margin:0;height:100%}#baguetteBox-overlay .full-image img{display:inline-block;width:auto;height:auto;max-height:100%;max-width:100%;vertical-align:middle;-webkit-box-shadow:0 0 8px rgba(0,0,0,.6);-moz-box-shadow:0 0 8px rgba(0,0,0,.6);box-shadow:0 0 8px rgba(0,0,0,.6)}#baguetteBox-overlay .full-image figcaption{display:block;position:absolute;bottom:0;width:100%;text-align:center;line-height:1.8;white-space:normal;color:#ccc;background-color:#000;background-color:rgba(0,0,0,.6);font-family:sans-serif}#baguetteBox-overlay .full-image:before{content:"";display:inline-block;height:50%;width:1px;margin-right:-1px}#baguetteBox-slider{position:absolute;left:0;top:0;height:100%;width:100%;white-space:nowrap;-webkit-transition:left .4s ease,-webkit-transform .4s ease;transition:left .4s ease,-webkit-transform .4s ease;transition:left .4s ease,transform .4s ease;transition:left .4s ease,transform .4s ease,-webkit-transform .4s ease,-moz-transform .4s ease}#baguetteBox-slider.bounce-from-right{-webkit-animation:bounceFromRight .4s ease-out;animation:bounceFromRight .4s ease-out}#baguetteBox-slider.bounce-from-left{-webkit-animation:bounceFromLeft .4s ease-out;animation:bounceFromLeft .4s ease-out}@-webkit-keyframes bounceFromRight{0%,100%{margin-left:0}50%{margin-left:-30px}}@keyframes bounceFromRight{0%,100%{margin-left:0}50%{margin-left:-30px}}@-webkit-keyframes bounceFromLeft{0%,100%{margin-left:0}50%{margin-left:30px}}@keyframes bounceFromLeft{0%,100%{margin-left:0}50%{margin-left:30px}}.baguetteBox-button#next-button,.baguetteBox-button#previous-button{top:50%;top:calc(50% - 30px);width:44px;height:60px}.baguetteBox-button{position:absolute;cursor:pointer;outline:0;padding:0;margin:0;border:0;-moz-border-radius:15%;border-radius:15%;background-color:#323232;background-color:rgba(50,50,50,.5);color:#ddd;font:1.6em sans-serif;-webkit-transition:background-color .4s ease;transition:background-color .4s ease}.baguetteBox-button:focus,.baguetteBox-button:hover{background-color:rgba(50,50,50,.9)}.baguetteBox-button#next-button{right:2%}.baguetteBox-button#previous-button{left:2%}.baguetteBox-button#close-button{top:20px;right:2%;right:calc(2% + 6px);width:30px;height:30px}.baguetteBox-button svg{position:absolute;left:0;top:0}.baguetteBox-spinner{width:40px;height:40px;display:inline-block;position:absolute;top:50%;left:50%;margin-top:-20px;margin-left:-20px}.baguetteBox-double-bounce1,.baguetteBox-double-bounce2{width:100%;height:100%;-moz-border-radius:50%;border-radius:50%;background-color:#fff;opacity:.6;position:absolute;top:0;left:0;-webkit-animation:bounce 2s infinite ease-in-out;animation:bounce 2s infinite ease-in-out}.baguetteBox-double-bounce2{-webkit-animation-delay:-1s;animation-delay:-1s}@-webkit-keyframes bounce{0%,100%{-webkit-transform:scale(0);transform:scale(0)}50%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes bounce{0%,100%{-webkit-transform:scale(0);-moz-transform:scale(0);transform:scale(0)}50%{-webkit-transform:scale(1);-moz-transform:scale(1);transform:scale(1)}}
 @media only screen and (max-width: 768px) {
html {
margin-top: -70px;
}
} body::after {
display: none;
}
.wrap {
width: 100%;
}
#main.main {
padding: 0;
}
.entry-content, .content {
margin: 0;
}
.article {
margin-top: 30px;
}
#values .inner,
#services,
#team,
#footer-in {
width: 100%;
max-width: 1200px;
margin: 0 auto;
padding: 15px;
box-sizing: border-box;	
}
.date-tags {
display: none;
} .fade {
opacity: 0;
transition: all .8s ease;
}
.fade.show {
opacity: 1;
transform: none;
}
.fade_in_up {
transform: translate(0, 100px);
} body {
font-family: 'Libre Franklin', "Hiragino Kaku Gothic Pro", "游ゴシック体", "Yu Gothic", "Meiryo", sans-serif;
}
.article ul {
list-style: none;
padding-inline-start: 0;	
}
a {
transition: .5s;
}
.link {
text-align: center;
} .home .article h1 {
display: none;
}
h1.entry-title {
display: none;
}
.page_ttl {
position: relative;
margin-top: 0;
}
img.page_ttl_bg {
margin-top: 48px;
}
.article h1.page_ttl {
position: absolute;
top: 50%;
left: 50%;
color: #fff;
font-size: 1.5rem;
font-weight: 500;
transform: translateX(-50%);
}
.article h2 {
background: none;
margin: 30px 0 0;
padding: 30px 0 0;
color: #666;
text-align: center;
}
.article h3, .article h4 {
border: none;
margin: 0;
padding: 0;
font-weight: 500;
text-align: center;
}
.article h3.desc {
padding-bottom: 1.2rem;
color: #666;
}
.article h4 {
font-size: .8rem;
font-weight: normal;
text-align: left;
} #wprmenu_bar.wprmenu_bar {
background: none;
}
#wprmenu_bar.wprmenu_bar.normalslide {
top: 0;
}
#wprmenu_bar.wprmenu_bar img.bar_logo {
width: 210px;
height: 37px;
}
#wprmenu_bar .hamburger-box {
width: 34px;
height: 30px;
margin-top: 10px;
}
#wprmenu_bar .hamburger--slider .hamburger-inner,
#wprmenu_bar .hamburger--slider .hamburger-inner::before,
#wprmenu_bar .hamburger--slider .hamburger-inner::after {
width: 34px;
height: 2px;
border-radius: 0;
}
#wprmenu_bar .hamburger--slider .hamburger-inner::before {
top: 6px;
}
#wprmenu_bar .hamburger--slider .hamburger-inner::after {
top: 12px;
right: 0;
width: 17px;
}
#wprmenu_bar .hamburger--slider.is-active .hamburger-inner {
top: -6px;
}
#wprmenu_bar .hamburger--slider.is-active .hamburger-inner::before {
top: 10px;
}
#wprmenu_bar .hamburger--slider.is-active .hamburger-inner::after {
top: 20px;
width: 34px;
}
#mg-wprm-wrap.cbp-spmenu-right {
top: 0 !important;
}
#wprmenu_menu_ul {
padding-top: 80px !important;
}
#mg-wprm-wrap ul li {
border: none !important;
}
#mg-wprm-wrap #wprmenu_menu_ul li.menu-item a {
padding: 13px 50px;
}
#mg-wprm-wrap {
background-size: 70% !important;
background-repeat: no-repeat !important;
background-position: 10px 20px !important;
} .header-container-in.hlt-top-menu {
background: rgba(0, 0, 0, .5);
}
#header-in img {
width: 170px;
height: auto;
margin-top: 20px;
margin-left: 20px;
padding-top: 25px;
box-sizing: border-box;
}
.header-container-in {
position: fixed;
top: 0;
z-index: 1;
}
.navi-in > ul {
justify-content: flex-start;
flex-flow: row nowrap;
}
#navi .navi-in > ul li {
width: auto;
height: 50px;
padding-left: 50px;
line-height: 50px;
}
.navi-in a {
font-size: 12px;
}
.lang {
list-style: none;
display: flex;
flex-flow: row nowrap;
position: absolute;
top: 0;
right: 0;
margin-right: 50px;
}
.lang li {
width: 30px;
font-size: .8rem;
}
.lang li a {
display: block;
position: relative;
color: #fff;
text-align: center;
text-decoration: none;
}
.lang li.jp a::after, .lang li.en a:hover::after {
position: absolute;
bottom: -13px;
left: 8px;
content: "・";
}
.lang li.en a {
color: #aaa;
}
.lang li.en a:hover {
color: #fff;
} #footer-in {
padding: 5px 15px 0;
}
.footer {
margin: 0;
padding: 0;
}
.footer-left {
width: 66.6666%;
}
.footer-left p {
margin-top: .5em;
font-size: .88rem;
line-height: 1.6;
}
.footer-center {
display: none;
}
.widget_nav_menu ul, .widget-footer-mobile ul.menu {
display: flex !important;
flex-direction: row !important;
justify-content: center;
margin: 1em 0 80px;
}
.widget_nav_menu li, .widget-footer-mobile .menu li {
background: #fff !important;
width: 30px !important;
height: 30px !important;
margin: 0 3px;
border-radius: 50%;
text-align: center;
line-height: 30px;
}
#footer .footer-right a, #footer .footer-widgets-mobile  .menu li a {
display: inline-block;
width: 30px;
height: 30px;
padding: 0;
border-radius: 50% !important;
color: #ccc !important;
}
.copyright {
position: relative;
margin-bottom: 8px;
}
.copyright::before {
display: inline-block;
position: absolute;
top: -63px;
left: 50%;
background: url(//atelierlapaz.jp/wp-content/uploads/favicon.png);
background-size: contain;
width: 60px;
height: 60px;
transform: translateX(-50%);
content: "";
}
.go-to-top .go-to-top-button {
background: rgba(0, 0, 0, .5);
} #main_visual {
margin-top: 0;
}
#slick img {
width: 100vw;
height: 100vh;
object-fit: cover;
}
#slick .slick_item {
position: relative;
color: #fff;
}
.slick-slide {
position: relative;
}
.caption {
position: absolute;
top: 50%;
left: 50%;
z-index: 2;
width: calc(100% - 40px);
padding: 20px;
color: #fff;
font-size: .8rem;
font-weight: normal;
text-align: center;
opacity: 0;
transition: .3s ease;
transform: translate(-50%, -48%);
}
.caption.on {
opacity: 1;
transition-delay: .5s;
transform: translate(-50%, -50%);
}
.article h2.slick {
color: #fff;
font-size: 1.5rem;
font-weight: 500;
}
.slick-current .caption .desc {
margin: 0;
line-height: 1.4;
}
#slick .slick-dots {
top: calc(50vh - 40px);
right: 0;
list-style: none;
width: 6%;
padding: 0;
margin: 0;
text-align: right;
z-index: 1001;
}
#slick .slick-dots li {
display: block;
margin: 2.5px 0;
}
#slick .slick-dots li button::before {
left: auto;
color: #fff;
font-size: 12px;
opacity: .5;
}
#slick .slick-dots li.slick-active button::before {
opacity: 1;
} #about {
clear: both;
}
.co_info, .service_info {
display: flex;
flex-flow: column wrap;
width: 100%;
max-width: 1200px;
margin: 0 auto;
padding: 15px 15px 30px;
box-sizing: border-box;
}
.service_info.last {
padding-bottom: 0;
}
.co_info.concept {
text-align: center;
}
.info_txt {
position: relative;
width: 100%;
}
.info_txt li {
font-size: .9rem;
}
.info_txt li.date {
position: relative;
background: #ddd;
width: 90%;
height: 4px;
margin: 5px 50px 15px 0;
}
.info_txt li.date::before {
position: absolute;
top: -.6rem;
right: -40px;
font-size: .8rem;
}
.info_txt li.one::before { content: "98%"; }
.info_txt li.two::before { content: "83%"; }
.info_txt li.three::before { content: "89%"; }
.info_txt li.four::before { content: "85%"; }
.info_txt li.five::before { content: "60%"; }
.info_txt li.six::before { content: "45%"; }
.info_txt li.seven::before { content: "64%"; }
.info_txt li::after {
position: absolute;
background: #DCAD6B;
height: 100%;
content: "";
animation: graph 3.5s 1 ease;
}
.info_txt li.one::after { width: 98%; }
.info_txt li.two::after { width: 83%; }
.info_txt li.three::after { width: 89%; }
.info_txt li.four::after { width: 85%; }
.info_txt li.five::after { width: 60%; }
.info_txt li.six::after { width: 45%; }
.info_txt li.seven::after { width: 64%; }
@keyframes graph {
0% { width: 0; }
}
.co_info .info_txt p {
font-size: .8rem;
}
.co_info .info_txt p {
font-size: 1em;
}
.co_info.concept h3 {
display: inline-block;
border-bottom: solid 1px #7f7f7f;
font-weight: bold;
} #values {
position: relative;
background: linear-gradient(rgba(255, 255, 255, .7), rgba(255, 255, 255, .7)), url(//atelierlapaz.jp/wp-content/uploads/values-bg.jpg);
background-size: cover;
background-position: center;
color: #555;
}
#values img {
width: 100%;
padding: 0 25%;
box-sizing: border-box;
text-align: center;
} #services p {
font-size: .9rem;
}
.service_img, .service_txt {
width: 100%;
padding: 0 15px;
box-sizing: border-box;
}
.service_txt h3 {
color: #7f7f7f;
font-size: 1.3rem;
font-weight: bold;
text-align: center;
}
.service_txt {
line-height: 1.5;
} #team {
max-width: 1360px;
}
#team .service_info {
max-width: initial;
}
.member {
margin: 1em 0;
}
.row {
display: flex;
flex-flow: column wrap;
}
.row_box {
margin: 1em 0;
font-size: .8rem;
line-height: 1.4;
}
.mem_box h3 {
padding: 10px 0;
font-size: 1rem;
font-weight: bold;
text-align: left;	
}
.mem_box h3.nr {
letter-spacing: -.2em;
}
.mem_img {
position: relative;
background: url(//atelierlapaz.jp/wp-content/uploads/member-bg.png);
background-position: center;
background-size: 100% auto;
background-repeat: no-repeat;
text-align: center;
}
.mem_box .en {
font-size: .7rem;
}
.mem_img img {
width: 50%;
height: auto;
}
.row_box ul {
padding-left: 1.2em;
}
.row_box .more_txt li {
position: relative;
}
.row_box .more_txt li::before {
position: absolute;
left: -1em;
content: "- ";
} .row_box label {
display: block;
position: relative;
width: 32%;
margin: auto;
padding: 0.15em 1em .1em;
border: 1px solid #aaa;
box-sizing: border-box;
color: #aaa;
font-size: .6rem;
font-weight: 500;
text-align: center;
cursor: pointer;
transition: all 0.3s;
}
.row_box label:hover {
background: #aaa;
color: #fff;
transition: all 0.3s;
}
.row_box label::after {
color: #aaa;
font-family: 'FontAwesome';
content: " \f067";
}
.row_box label:hover::after {
color: #fff;
}
.row_box input:checked ~ label::after {
color: #aaa;
font-family: 'FontAwesome';
content: "\f068";
}
.row_box input:checked ~ label:hover::after {
color: #fff;
}
.row_box input {
display: none;
}
.row_box .more_txt {
position: relative;
height: 0;
margin-top: 10px;
overflow-y: hidden;
transition: height .3s ease-in-out, box-shadow .6s linear;
}
.row_box input:checked ~ div {
transition: height .5s ease-in-out, box-shadow .1s linear;
} .row_box input:checked ~ .more_txt {
height: 440px;
} #contact, #hiring {
max-width: 1200px;
margin: 0 auto;
padding: 15px;
box-sizing: border-box;
}
.loc {
display: flex;
flex-flow: column wrap;
}
.ad {
height: calc(100% - 2%);
padding: 10px 15px;
box-sizing: border-box;
color: #aaa;
box-shadow: 0 2px 20px rgba(0, 0, 0, .2);
}
.article .ad h2 {
margin-top: 1em;
color: #5a5a5a;
font-size: 1.1rem;
}
.article .ad .mail {
margin: 0;
}
.article .ad ul.sns_btn {
display: flex;
flex-flow: row nowrap;
margin-top: 0;
}
.article .ad .sns_btn li {
width: 32px;
height: 32px;
border-radius: 50%;
text-align: center;
line-height: 32px;
box-shadow: 0 0 15px rgba(0, 0, 0, .2);
}
.article .ad .sns_btn li a {
color: #aaa;
text-decoration: none;
transition: .5s;
}
.article .ad .sns_btn li a:hover {
color: #dbad6b;
}
.article h2.msg, .article h3.msg {
max-width: 880px;
margin: 50px auto 0;
font-weight: bold;
text-align: left;
}
.wpcf7 p {
margin: 0;
}
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 select,
.wpcf7 textarea,
.wpcf7 input[type="submit"],
.wpcf7 input[type="file"] {
background: #fff;
width: 100%;
margin-bottom: 15px;
padding: 15px;
border: 1px solid #ccc;
border-radius: 0;
box-sizing: border-box;
color: #7b7b7b;
font-size: .8rem;
-webkit-appearance: none;
appearance: none;
}
.wpcf7 input[type='submit'],
.wpcf7 input[type="file"] {
background: #060606;
border: none;
border-radius: 0;
color: #fff;
transition: .5s;
}
.wpcf7 input[type='submit'],
.wpcf7 input[type="file"] {
max-width: 90%;
height: 50px;
}
.wpcf7 input[type="file"] {
border: none;
}
.wpcf7 input[type='submit']:hover,
.wpcf7 input[type="file"]:hover {
background: #5a5a5a;
}
.form_btn {
display: flex;
flex-flow: column wrap;
max-width: 880px;
margin: 0 auto;
}
form.wpcf7-form {
text-align: center;
}
div.wpcf7 .ajax-loader {
display: none !important;
} #hiring {
max-width: 1360px;
}
.article .working_box h3, .article .working_box h4 {
font-weight: bold;
text-align: center;
}
.article .working_box h4 {
margin: .3em 0;
font-size: 1rem;
}
.working_box p {
line-height: 1.4;
}
@keyframes Down {
0% { transform: translateY(-50px); opacity: 0; }
100% { transform: translateY(0%); opacity: 1; }
}
@media only screen and (min-width: 768px) { img.page_ttl_bg {
margin-top: 0;
}
.article h1.page_ttl {
top: calc(50% - 50px);
font-size: 4rem;
}
.article h2 {
margin-top: 50px;
}
.article h3.desc {
padding-bottom: 1.5rem;
} .article h2.slick, .article h1 {
font-size: 2rem;
} #about h2 {
padding-top: 60px;
}
.co_info, .service_info {
padding-top: 30px;
padding-bottom: 50px;
} .service_info {
flex-flow: row wrap;
justify-content: space-between;
padding: 20px;
}
.service_info.last {
padding-bottom: 30px;
}
.service_img {
width: 35%;
}
.service_txt {
width: 62%;
}
.info_box, .mem_box {
padding: 0 15px;
box-sizing: border-box;
} .row_box.desc {
display: flex;
flex-flow: row nowrap;
justify-content: space-between;
}
.mem_info {
width: 32%;
}
.mem_img {
position: relative;
width: 66%;
height: 250px;
}
.row_box.ul {
margin-top: 0;
}
.mem_img img {
left: 15%;
width: 40%;
} .row_box label {
margin-left: 0;
} .row_box input:checked ~ .more_txt {
height: 260px;
} .wpcf7 input[type='submit'],
.wpcf7 input[type="file"] {
width: 250px;
}
.wpcf7 input[type="file"] {
max-width: 280px;
}
.form_btn {
flex-flow: row nowrap;
}
}
@media only screen and (max-width: 768px) {
#header-in img {
display: none;
}
#navi .navi-in > .menu-mobile {
display: none;
}
#wprmenu_menu_ul li.jp, #wprmenu_menu_ul li.en {
display: inline-block !important;
width: 48% !important;
}
#wprmenu_menu_ul li {
text-align: center;
}
#wprmenu_menu_ul li.jp {
text-align: right;
}
#wprmenu_menu_ul li.en {
text-align: left;
}
.lang li {
display: none;
}
}
@media only screen and (min-width: 769px) { .article {
margin-top: -1rem;
} .header-container-in {
position: fixed;
}
.header-container-in, .header-in {
height: 50px;
animation: Down 1s ease-out 0s 1 normal;
}
.navi {
background: transparent;
}
#navi .navi-in a {
color: #fff;
}
#navi .navi-in a:hover {
background: none;
color: #dbad6b;
} .co_info {
flex-flow: row nowrap;
justify-content: space-between;
}
.info_txt {
width: 40%;
padding: 0 15px;
box-sizing: border-box;
} #values {
background-attachment: fixed;
}
#values::after {
position: absolute;
top: 32%;
left: 50%;
background: url(//atelierlapaz.jp/wp-content/uploads/cross.png);
background-size: cover;
width: 100px;
height: 100px;
content: "";
transform: translateX(-50%);
} .service_info {
flex-flow: row wrap;
}
.info_box {
width: 25%;
} .row_box {
margin: 0;
}
.mem_img {
background: #ccc;
height: 150px;
margin-top: 2em;
}
.mem_info.upper {
margin-top: 15vw;
}
.mem_img.upper {
margin-top: 18vw;
}
.mem_img.lower {
margin-bottom: 14.5vw;
}
.mem_img img {
position: absolute;
width: 30%;
}
.mem_img .mem1,
.mem_img .mem3 {
bottom: 50%;
}
.mem_img .mem2 {
top: 30%;
} .row_box label {
width: 32%;
margin: 0;
} .loc {
flex-flow: row nowrap;
justify-content: space-between;
}
.map {
width: 64%;
}
.ad {
width: 34%;
}
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 select,
.wpcf7 textarea {
width: 100%;
max-width: 880px;
}
}
@media only screen and (min-width: 1024px) { .navi-in > ul li {
width: 14%;
} .widget_nav_menu ul {
justify-content: flex-end;
margin-bottom: 120px;
} .slick-slide .caption {
font-size: 1.5rem;
}
.article h2.slick, .article h1 {
font-size: 4rem;
} .row {
height: 100%;
}
.member, .working_info {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
}
.mem_box {
width: 33.2%;
}
.mem_info {
height: 22vw;
}
.mem_info.upper {
margin-top: 0;
}
.mem_img.upper {
margin-top: 2em;
}
.mem_img.lower {
margin-bottom: 0;
}
.mem_img {
height: 100px;
}
.mem_img img {
width: 40%;
} .row_box input:checked ~ .more_txt {
height: 480px;
} .working_box {
width: 30%;
}
}
@media only screen and (min-width: 1200px) { .mem_info {
height: 17vw;
}
}
@media only screen and (min-width: 1480px) { .article h1 {
top: 30vh;
} .slick-slide .caption {
font-size: 2.2rem;
}
.article h2.slick, .article h1 {
font-size: 5.8rem;
} .mem_img {
height: 150px;
}	
.mem_info {
height: 14vw;
} .row_box input:checked ~ .more_txt {
height: 400px;
}
} #projects {
padding: 15px 15px 0;
}
.isotope-item {
z-index: 2;
}
.isotope-hidden.isotope-item {
pointer-events: none;
z-index: 1;
}
.isotope,
.isotope .isotope-item {
transition-duration: .8s;
}
.isotope {
transition-property: height, width;
}
.isotope .isotope-item {
transition-property: transform, opacity;
}
.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
transition-duration: 0s;
}
.isotope.infinite-scrolling {
transition: none;
}
#options {
padding-bottom: 10px;
margin: 0 auto;
}
#options ul {
display: flex;
flex-flow: row wrap;
justify-content: center;
padding: 0;
}
#options li {
display: flex;
align-items: center;
margin: .2em .2em 0;
padding: 0 10px;
text-align: center;
line-height: 1.3;
}
#options li a {
display: block;
padding: .4em .2em;
color: #5a5a5a;
font-size: 13px;
font-weight: 500;
text-decoration: none;
}
#options li a.selected {
border-bottom: solid 1px #4c6473; 
}
#options.clearfix::before, #options.clearfix::after {
display: table;
content: "";
}
#options.clearfix { zoom: 1; }
#iso_box {
width: 100%;
max-width: 1360px;
margin: 0 auto 20px;
box-sizing: border-box;
}
#iso_box .element {
float: left;
position: relative;
width: 100%;
height: auto;
padding: 5px 1.5%;
box-sizing: border-box;
overflow: hidden;
}
#iso_box .element img {
display: inline-block;
vertical-align: bottom;
}
#iso_box .element {
display: block;
position: relative;
color: #fff;
text-decoration: none;
}
#iso_box .element .txt {
display: flex;
flex-flow: column wrap;
justify-content: center;
align-items: center;
position: absolute;
top: 5px;
width: 97%;
height: calc(100% - 10px);
opacity: 0;
transition: .3s;
}
#iso_box .element .txt {
background: rgba(76, 100 ,115, .8);
}
#iso_box .element:hover .txt {
opacity: 1;
}
#iso_box .element .right {
position: absolute;
bottom: 15px;
right: 15px;
color: 	#80A7BF;
text-align: right;
}
#iso_box .element h2 {
background: none;
margin: 0;
padding: 10px;
color: #fff;
}
#iso_box .element .nr {
letter-spacing: -.2em;
}
#iso_box .element p {
margin: 0;
}
#iso_box .element p.detail {
margin: 1em 0;
}
#iso_box .element h2, #iso_box .element p {
text-align: center;
transition: .6s;
transform: translateY(90%);
}
#iso_box .element:hover h2, #iso_box .element:hover p {
transform: translateY(0);
}
#iso_box .element ul {
padding: 0 20px;
}
#iso_box .element li {
position: relative;
}
#iso_box .element li::before {
position: absolute;
left: -.5em;
content: "- ";
}
#iso_box .element {
font-size: .8em;
line-height: 1.2;
}
@media only screen and (min-width: 768px) {
#iso_box {
padding-left: 1.5%;
}
#iso_box .element {
width: 49%;
margin: 10px auto;
}
#iso_box .element .txt {
width: 94%;
}
}
@media only screen and (min-width:1024px) {
#iso_box .element{
width: 32.5%;
}
#iso_box .element .txt {
width: 91%;
}
}