@charset "UTF-8";
/*
Theme Name: 富裕層世帯の離婚
Version: 1.0
comment: 2022 redesigned website
*/

/* #Reset & Basics
================================================== */
	html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
		margin: 0;
		padding: 0;
		border: 0;
		font-size: 100%;
		font: inherit;
		vertical-align: baseline; }
	blockquote, q {
		quotes: none; }
	blockquote:before, blockquote:after,
	q:before, q:after {
		content: '';
		content: none; }
	table {
		border-collapse: collapse;
		border-spacing: 0; }

.grecaptcha-badge { visibility: hidden; }


/* #Base styles
================================================== */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
* { -webkit-text-size-adjust: none; }
html {
  width:100%;
  height: 100%;
}

:root {
  scroll-padding-top: 8em;
  scroll-behavior: smooth;
}

body {
  color: #000;
  line-height: 1.8em;
  background-color:#ececec;
  font-family: 'Noto Sans JP', sans-serif;
}

strong { font-weight: bold; }

section {
	width: 100%;
}

a{
	color: #000;
	text-decoration: none;
	transition: 0.5s;
}
#footer a,.g_button a {
	color: #fff;
}
a:hover{
	opacity: 0.3;
}

.topcopy{
    width: 100%;
    position: absolute;
    animation: animex 1s linear;
}

.main-v::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, .3), rgba(0, 0, 20, .3)100%);
}

.nobr{
    white-space: nowrap;
}
.cen{
    width: 100%;
    text-align: center;
}
.yugo{
    font-family: "游ゴシック体", "Yu Gothic", sans-serif;
}
img{
	display: block;
	max-width: 100%
}
a{
    color: #25364f;
}
.sect a{
    border-bottom: 1px dotted #25364f;
}
strong{
	color: #25364f;
}
b{
    font-size:1.1em;
    color: #000;
    font-weight: bold;
    font-family: serif;
}
.thin b{
    font-size:1em;
    color: #000;
    font-weight: bold;
    font-family: "游ゴシック体", "Yu Gothic", sans-serif;
}
p{
    font-size:1em;
    margin-bottom: 2.2em;
    line-height: 2.2em;
}

#sec04 p{
    margin-bottom: .2em;
    line-height: 1.8em;
    background-color: #fff;
    padding: .5em 1.5em 1em 1.5em;
    box-sizing: border-box;
}

.topcopy h1,.topcopy h2{
    color:#fff;
    text-align: center;
    text-shadow: .05em .05em 0.2em rgba(0,0,0,0.6);
    z-index: 10;
}
h1{
    padding-top: 2em;
    padding-bottom: .5em;
	font-size:4vw;
	line-height: 1.6em;
    font-family: serif;
	font-weight: 600;
    color: #25364f;
    font-feature-settings: "palt" 1;
}

.topcopy h2{
    font-size:1.1vw;
    line-height: 2.2em;
}

h3{
	font-size:2em;
	line-height: 1.6em;
    margin-bottom: 0.5em;
    font-family: serif;
	font-weight: 600;
    color: #25364f;
    border-bottom: 3px solid #25364f;
}
h4{
    margin-top: 1em;
	font-size:1.8em;
	line-height: 1.6em;
    margin-bottom: 0.5em;
    font-family: serif;
	font-weight: 600;
    color: #25364f;
    border-bottom: 2px solid #25364f;
}

#sec04 h5{
    margin: 1em 0 0 0;
	padding:.3em 1.8em .3em 1.5em;
	font-size:1.3em;
    font-weight: 500;
    font-family: serif;
    color: #fff;
    background-color:#25364f;
    display: inline-block;
    clip-path: polygon(0% 100%, 3.5% 0%, 100% 0%, 96.5% 100%);
}
h5 b{
    color: #fff;
}
.titlebox{
    font-size:1.05em;
    border-radius: .5em;
}

#sec06 h5{
    margin-right: 1em;
    margin-top:0em;
	margin-bottom:0.25em;
	padding:1px 0;
	font-size:1.4em;
    font-weight: bold;
    font-family: serif;
    color:#25364f;
    text-decoration: none;
	border-bottom:2px solid #25364f;
    display: inline-block;
}

h6{
    color:#25364f;
    font-size:1.1em;
    margin:1em 0 0 0;
    padding: .4em;
    font-weight: 500;
    width: fit-content;
    background-color: rgba(60,60,90,.05);
    box-sizing: border-box;
    padding-left: 1em;
     border-radius: .5em;
}

.ex{
    font-size:.9em;
    color:#25364f;
    font-weight: 500;
    margin-top: .5em;
    background-color: rgba(60,60,90,.08);
    padding: .1em .8em;
    box-sizing: border-box;
    width: fit-content;
    display: block;
    border-radius: .3em;
}



/* acm */
.acm dl,
.acm dt,
.acm dd {
margin: 0;
padding: 0;
transition: .5s;
}

.acm dl {
position: relative;
overflow: hidden;
}

.acm dl>input {
display: none;
}

.acm dt {
position: relative;
z-index: 1;
cursor: pointer;
}

.acm dd {
position: absolute;
visibility: hidden;
transform: translateY(-10%);
border-top: none;
opacity: 0;
}

.acm dl>input:checked+label+dd {
position: relative;
visibility: visible;
transform: translateY(0);
opacity: 1;
}


.main-txt{
    font-size:1.1em;
}
.fex{
    font-size:0.8em;
    line-height: 1.8em;
    margin-top:0.5em;
    text-indent: -1em;
    padding: 0;
    padding-left: 1.2em;
}
.thin{
    padding: 0.5em 0;
    line-height: 1.6em;
}
.thin p{
    line-height: 1.6em;
    margin: 0;
    text-indent: -1em;
    padding: 0;
    padding-left: 1.2em;
}
.onsp{
    display: none;
}
.under-tel{
    display: none;
}
.ft_ccd{
	font-family: 'Sinhala MN', serif;
}
.view{
	font-size:1.5em;
	font-family: 'Futura', 'Futura PT', sans-serif;
	font-weight:300;
}
.super{
	vertical-align: super;
	font-size:0.3em
}
.ppp{
    width: 90%;
    display: block;
    margin: 0 auto;
    margin-top: 2em;
}
.ppp p{
    text-align: left !important;
    margin: 0;
    text-indent: -1.3em;
    padding-left: 1.3em;
}

/* #Front
================================================== */
#head-box{
	position: -webkit-sticky; /* safari対応 */
    position: sticky;
    top:0;
	width: 100%;
	height:8vh;
	display: flex;
    justify-content: center;
    align-items: center;
	font-size:0.9vw;
	background-color:#fff;
	z-index: 10;
    box-shadow: 0.1em 0.1em 0.5em rgba(0,0,0,0.1);
    font-family: Futura, 'Futura PT', sans-serif;
    font-weight: 500;
}
.hbox{
	position: absolute;
    right: 0;
	padding-right:2em;
    box-sizing: border-box;
}
.hbox a{
    margin: 0 1.2em;
}
.head-left{
    position: absolute;
    top:0;left:0;
    width:auto;
    height:8vh;
    padding-left: 2em;
    padding-right: 3em;
    display: inline-block;    
    clip-path: polygon(0% 100%, 0% 0%, 92% 0%, 85% 100%);
    background-color: #25364f;
    display: flex;
    justify-content: center;
    align-items: center;
}
.t_logo{
	width: 48vw;
}
.t_logo.lp2t{
	width: 48vw;
}


.linkbox{
	position: absolute;
	left: 0;
	width: 30%;
	height:8vh;
	z-index: 1;
	display: block;
}
.main-v{
	width: 100%;
	position: relative;
	height: 92vh;
	background-image: url("../images/mv3.webp");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: 45% top;
    display: flex;
    justify-content: center;
    align-items: center;
}

.top-box{
	width: 100%;
	position: relative;
	top:8vh;
	height: auto;
    padding:5em 0;
    box-sizing: border-box;
}
._ttl{
    font-size:1.1em;
    font-weight: bold;
    text-decoration: underline;
    margin-bottom: 1em;
}
.main-ccd{
   max-width:20%;
	 animation-delay: 0.4s;
    animation: anime2 1.4s linear;
    position: relative;
}

@keyframes anime1 {
	0% {opacity: 0;bottom:-3%;}
	50% {opacity: 0;}
	100% {opacity: 1;bottom:0%;}
}
@keyframes anime2{
	0% {opacity: 0;bottom:-3%;}
	60% {opacity: 0;}
	100% {opacity: 1;bottom:0%;}
}
@keyframes anime3{
	0% {opacity: 0;}
	80% {opacity: 0;}
	100% {opacity: 1;}
}

.sec{
	height: auto;
	text-align: left;
	padding: 2.5em 0;
	box-sizing: border-box;
}

.box-margin{
    width:  1000px;
    max-width: 90%;
    margin: 0 auto;
    text-align: left;
}

.bgw{
	background-color: #fff;
}
.bgg{
    background-color: #f7f7f7;
}
.bgb{
    background-color: #000;
		color:#fff;
}
.fix-tel{
    position: absolute;
    top:-0.7em;
    right:3em;
    color: #25364f;
    font-size:0.95em;
    line-height: 1.6em;
    font-weight: bold;
    font-family: "游ゴシック体", "Yu Gothic", sans-serif;
    letter-spacing: 0.01em;
    display: inline-block;
    margin-left: 2em;
}
.fix-tel img{
    width:2em;
    position: relative;
    top:0.4em;
    margin-right: 0.5em;
    padding-bottom: 0.5em;
}
.teltex{
    font-size:1.5em;
}

/* #sec01
================================================== */
#sec01{
	height: auto;
    padding-top:5em;
}

.exl{
	font-size: 0.9em;
	text-align: left;
	margin-top: 0.2em;
	position: absolute;
	left: 0.5em;
}
.exr{
	font-size: 0.9em;
	margin-top: 0.2em;
	position: absolute;
	right:0.5em;
}

/* #sec02
================================================== */

.b_arrow{
	width: 6%;
	margin: 1em auto;
}

.inter{
    height: 35vh;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
}
.inter img{
 width: 4%;
}

.circle{
	width: 28%;
	margin-bottom:16em;
}
.close{
    height: 35vh;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
}
.tw_arrow{
	width: 4%;
}

.side-l{
    width: 60%;
    float: left;
}
.illust01{
    width: 40%;
    float: right;
    margin-left: 3em; 
    margin-top: 1em;
    box-sizing: border-box;
}
.illust02{
    width: 35%;
    float: right;
    margin-left: 3em; 
    margin-top: 1em;
    box-sizing: border-box;
}
.illust03{
    width: 26%;
    padding-top: 1em;
    padding-right: 1em;
    float: right; 
    position: relative;
}
.photo01{
    width: 48%;
    float: right; 
    box-sizing: border-box;
}

@media screen and (orientation: portrait) {
.illust01,.illust02,.photo01{
    width: 80%;
    float: inherit;
    padding: 1em 0;
    margin: 1em auto;
    display: block;
}
.photo01{
    padding-top: 0;
    margin-top: 0;
    width: 100%;
}
.illust03{
    float: inherit;
    width: 45%;
    padding: 0 !important;
    margin: 1em auto;
    display: block;
    box-sizing: border-box;
    top:0 !important;
}
#sec07 h4{
    border-bottom: 3px solid #25364f !important;
    width: 90%;
    margin: auto;
    padding-top: 1.5em;
    display: block;
    }
    
}

/* Legal Prime
------------------------------------------------------------*/

/* INFO */

#info-m{
	margin:1em auto;
	width:100%;
    text-align: center;
}

.news a li:hover{
    opacity: 0.6;
    transition: 0.4s;
    text-decoration:none;
}
.nt-align{
    text-align: left;
    }
.nt-left,.nt-right{
    text-align: left;
    width:80%;
    margin:0 auto;
}
.nt-left{
    margin-top: 3em;    
}
.nt-left.mar2{
    float:left;
    margin:0 5%;
    }
.news ul, .news li{
    list-style: none;
}

.news li{
    border-bottom:1px solid #999;
    padding: 0.6em 0;
    margin: 0;
    line-height: 2em;
}
.date{
    display: inline-block;
    font-family: serif;
    font-weight: 500;
    font-size: 1.1em;
}
.news-cat{
    font-size:0.8em;
    font-weight: bold;
    padding: 0.4em 0;
    margin: 0;
    margin-right: 1em;
    line-height: 1em;
    width: 7.5em;
    color:#fff;
    background-color:#25364f;
    display: inline-block;
    text-align: center;
    position: relative;
    top:-0.1em;
}
.news-title{
    display: inline-block;
    line-height: 1.5em;
    height: 2.7em;
}

@media screen and (orientation: portrait) {
h5 {
    margin-top:1em;
}
h6 {
    font-size:1.2em;
}
#sec04 h5 {
    width: 100%;
    box-sizing: border-box;
}
#sec04 p {
    font-size:1.1em;    
    }
#sec06 h5 {
    font-size:1.25em;
    }
.news li{
        height: auto;
    }
.news-title{
    height: auto;
    }
}

.news-cat{
    font-size:0.8em;
    font-weight: 900;
    font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}
.new-mark{
    font-size:0.8em;
    font-weight: bold;
    font-family: 'FB Californian Text','Garamond', serif;
	-webkit-animation:blink 1.5s ease-in-out infinite alternate;
    -moz-animation:blink 1.5s ease-in-out infinite alternate;
    animation:blink 1.5s ease-in-out infinite alternate;
    margin-left:0.2em;
}
@-webkit-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
.s-more{
    color:#25364f;
    text-align: right;
    font-size:1em;
    font-family: 'FB Californian Text','Garamond', serif;
}

/* FLOW */

.flow{
    text-align: justify;
    padding:1em 2em;
}
.flow p{
    margin-bottom: 1em;
    line-height: 2em;
}
.cfex{
    width:95%;
    text-align: left;
    margin: 0 auto;
    margin-bottom: 2em;
}
.cfex p{
    font-size:.9em;
    line-height: 1.6em;
    margin:0.2em 0;
    text-indent: -1em;
    padding: 0;
}


.contact{
    text-align: center;
    font-size:1.1em;
    margin: 1em auto;
}
.contact-box{
    font-weight: bold;
    border: 2px solid #25364f;
    height: 3.5em;
    margin: 1em 2.5em;
    margin-left: auto;
    line-height: 1.5em;
    padding: 0.5em 1.5em;
    display:inline-block;
    white-space: nowrap;
    transition: .5s;
}
.contact-box:hover{
    color: #25364f;
    background-color: #fff;
}
.contact a:hover{
     color: #25364f;
    text-decoration: none;
}
.contact-inner{
    display: table;
    width: 100%;
    height: 100%;
}
.contact-text{
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    font-family: 'FB Californian Text','Garamond','游明朝体', 'Yu Mincho', YuMincho, 'ヒラギノ明朝 Pro', 'Hiragino Mincho Pro', 'MS P明朝', 'MS PMincho', serif;
}
label .ct{
    display: inline-block;
    width: 12em;
}
label br{
    display: none;
}
label.mess br{
    display:block;
}
label.mess{
    width: 100%;
}
#contact input {
    border:1px solid #999;
    border-radius: 0.25em;
    -webkit-border-radius: 0.25em;
    -moz-border-radius: 0.25em;
    max-width: 76%;
}
#contact input[type="text"],input[type="tel"],input[type="email"],input[type="date"]  {
    width: 30em;
	height:1.5em;
    padding:0.5em 1em;
    -webkit-appearance: none;
}
#contact input[type="date"]  {
	width:10em;
}
#contact input[type="submit"] {
    font-size:1.2em;
    margin-top: -4em;
	-webkit-appearance: none;
    color:#fff;
    padding: 0.2em 0.8em;
    background-color: #25364f;
    -webkit-transition: 0.6s;
    -moz-transition: 0.6s;
    -o-transition: 0.6s;
    -ms-transition: 0.6s;
    transition: 0.6s;
	}
#contact input[type="submit"]:hover {
    filter:alpha(opacity=60);
    -moz-opacity:0.60;
    -khtml-opacity: 0.60;
    opacity:0.60;
	}
textarea.wpcf7-textarea {
	padding:0.5em 2%;
	width:100%%;
    max-width:100%;
    min-width:100%;
    height:20em;
	line-height:1.8em;
    -webkit-appearance: none;
    border:1px solid #999;
    border-radius: 0.25em;
    -webkit-border-radius: 0.25em;
    -moz-border-radius: 0.25em;
    box-sizing: border-box;
	}

/*  弁護士紹介　*/
.e-name {
    color: #25364f;
    font-family: 'Century Gothic','Avenir-Medium','Helvetica','Arial', sans-serif;
    font-weight: 500;
    margin-top: -0.2em;
    margin-bottom: 0.5em;
}
.iwasaki{
    float: left;
    margin-right: 3em;
    margin-bottom: 1em;
    width:24%;
}
.sign{
    width:60%;
    display: inline-block;
    position: relative;
    top:0.5em;
}
table.lawyer {
    width: 100%;
    margin: 1.5em 0;
    }
.lawyer th {
    background: none;
    width: 35%;
    border: none;
    padding: 0 1em;
}
.lawyer td {
    border-top: none;
    padding: 1em 0;
}

.inner{
	width: 94%;
	margin: 0 auto;
	padding-bottom: 2em;
}
.office{
    width: 85%;
    max-width: 1100px;
    margin: auto;
    display: block;
}
.col2 li{
	display: inline-block;
	width: 50%;
  	margin: 1em 0 20px 0;
}

#sec07 dl{
	line-height: 1.2em;
}

#sec07 dt{
	clear: left;
	float: left;
	display: block;
	width: 25%;
	margin-right: 5%;
	margin-bottom: 1em;
	text-align: right;
	line-height: 1.6em;
}

#sec07 dd{
	width: 70%;
	float: left;
	text-align: left;
	margin-bottom: 1em;
	line-height: 1.6em;
}

#sec07 header{
	display: none;
}

.gmap {
    float: right;
    width: 46%;
    height: 32em;
    max-width:100%;
    padding: 1em 0;
}


@media screen and (orientation: portrait) {

.iwasaki{
    display: none;
    float: right;
    width:35%;
    margin-left: 1.5em;
}
.iwasaki p{
    text-align: justify;
}
.sign{
    width:60%;
}

}


 /* book

================================================== */
.books a{text-decoration:none; border:none;}
.books{width:100%; margin:.25em 0;}
.books img{width:30%; margin-left:2%; float:right;box-shadow: 4px 4px 6px 0 rgba(0, 0, 0, .2)}
blockquote{
    font-size:.9em;
    box-sizing: border-box;
    padding: 1em 2em;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: .8em;
}
blockquote, q {
		quotes: none; }
blockquote:before, blockquote:after,
	q:before, q:after {
		content: '';
		content: none; }
blockquote p{
    margin: 0;
    text-align: justify;
}
@media screen and (orientation: portrait) {
blockquote{display: block;padding: 2em;}
blockquote p,.booktext{width:100%;}
.books{width:100%; margin-top: 1em;}
.books img{width:31.3%; margin:0 1%; }
}

 /* Service
 ================================================== */
.service_list{
    width: 100%;
    float:left;
}
.service_list b{
    font-weight: normal;
    color:#25364f;
    font-size:0.9em;
    padding-right: 0.2em;
}
.service-title{
    display: inline-block;
    width:32.9%;
    white-space: nowrap;
    vertical-align: top;
}
.service-title a{
    font-feature-settings: "palt" 1;
    border-bottom:#25364f dotted 1px;
}
@media screen and (orientation: portrait) {
.service-link{
    top:6.9em;
    }
.service-title{
    font-size:.85em;
    width: calc(99% / 2);
    white-space: normal;
    line-height: 1.2em;
    box-sizing: border-box;
    }
.service-title b{
    font-size:.5em;
    position: relative;
    top:-.25em;
}
}

 /* Clients
 ================================================== */

.onserv{
    display: none;
}
#client p{
    line-height: 1.2em;
}
small{
    font-size:.8em;
}
.clients{
    box-sizing: border-box;
    text-align:center;
    padding: 2em 1em .01em 1em;
    margin-bottom: 5em;
    background-color: #fff;
    margin-bottom: 0;
    border-radius: 1em;
    }
.clients strong{
    font-size:1.1em;
    }
.clients p{
    padding-top: 0.5em;
    }
.clients img{
    width:11%;
    margin: 0 2.2%;
    display: inline-block;
    }

@media screen and (orientation: portrait) {
.clients img{
    width:15%;
    }
.clients p{
    text-align: justify;
    }
.clients br{
    display: none;
    }
}

/*================================================
 *  フッター
 ================================================*/
footer {
	clear:both;
}

.footmenu {
	width:100%;
	padding:1em 0;
	overflow:hidden;
	background:rgba(135,139,145,0.3);
    box-sizing: border-box;
}
.footmenu ul {
	position:relative;
	float:left;
	left:50%;
	margin:0;
	padding:0;
}
.footmenu li {
    font-size:.9em;
	position:relative;
	left:-50%;
	float:left;
	list-style:none;
	margin:0;
	padding:0 15px;
	text-align:center;
}
.footmenu a {
	text-decoration:none;
}
.footmenu a:hover {
	color:#333;
}

.copyright {
	clear:both;
	padding:20px 0;
	font-size:11px;
	text-align:center;
	color:#fff;
	background:#25364f;
}
.copyright img{
    display: inline-block;
}
.page-back{
    text-align: right;
    margin: 1.3em 1em;
    display: none;
}
.page-back a{
    color:#fff;
    background:#878b91;
    border:#878b91 1px solid;
    padding: 0.5em 0.6em;
    margin: 0.2em;
    border-radius: 0.25em;
    -webkit-border-radius: 0.25em;
    -moz-border-radius: 0.25em;
    z-index: 30;
}
.page-back a.wh{
    color:#878b91;
    background:#fff;
}
.page-down{
    margin: 1.3em 1em 1.3em 0;
}
.page-down a{
    color:#25364f;
    background:#fff;
    border:#25364f 1px solid;
    padding: 0.5em 0.6em;
    margin: 0.2em;
    border-radius: 0.25em;
    -webkit-border-radius: 0.25em;
    -moz-border-radius: 0.25em;
    z-index: 30;
}
/*================================================
 *  ページトップへの戻り
 ================================================*/
.totop {
	position:fixed;
	bottom:15px;
	right:15px;
}
.totop a {
	display:block;
	text-decoration:none;
    color: #fff;
}
.totop img {
	background: rgba(37,54,79,0.9);
}
.totop img:hover {
	opacity: 0.5;
}

/* Animation
***************************************************************************/

.fadein_ {
    opacity : 0;
    transform : translate(0, 1em);
    transition : all 0.8s;
}
h3.fadein_,h5.fadein_,.slide.fadein_ {
    opacity : 0;
    transform : translate(-0.8em, 0);
    transition : all 0.6s;
}
.fadein_.delay {
    transform : translate(0, 2.5em);
    transition : all 1.2s;
}
.fadein_.num{
	transform : translate(0, 0.5em);
	transition : all 0,5s;
}

.fadein_.scrollin_ {
    opacity : 1;
    transform : translate(0, 0);
}

/* Responsive
***************************************************************************/
@media screen and (max-width:1200px) {
	body {
	  font-size:1.1vw;
	}
}

@media screen and (orientation: portrait) {
body {
	font-size:2.8vw;
    line-height: 1.8em;
	}
p{
    margin-bottom: 1em;
}
.nt-left{
    width:100%;
    float:none;
    margin-right:0;
    }
.nt-right{
    width:100%;
    float:none;
    }
.nt-left.mar2{
    float:none;
    margin:0;
    }

.main-txt{
    font-size:1.3em;
}
p{
	font-size:1.2em;
	line-height: 1.8em;
}

#head-box{
	height:5vh;
    box-shadow: 0 0 0 rgba(0,0,0,0);
    z-index: 100;
    background-color: #25364f;
    position:fixed;
}
.head-left{
    height:5vh;
    background: none;
    padding-right: 0;
    clip-path:none;
}
.t_logo{
	width: 92vw;
}
.t_logo.lp2t{
	width: 100vw;
}
.top-box{
        font-size:1.2em;
    }
.cart{
   right:12%;
   width:7%;
}
.hbox{
        display: none;
    }
.linkbox{
			width: 60%;
			height:5vh;
		}
.main-v{
    top: 5vh;
	height:35vh;
}
.f_toptitle{
    max-width:25vw;
    top:2em;
    right:2em;
}
.f-topcopy{
    font-size:3.4vh;
    }
.main-logo{
    max-width:30%;
		animation: anime1 1.4s linear;
}
.main-ccd{
   max-width:60%;
	 margin-top: 8em;
	 animation: anime2 1.6s linear;
}
.col2 li{
    line-height: 2em;
	display: block;
	width: 100%;
  	margin: 1em 0 20px 0;
    }
.gmap {
    width: 100%;
    margin-bottom: -1em;
    }
h3 br{
	display: none;
}
.orderby{
    font-size:2.5vw;
    position: relative;
    top:-0.5em;
}
.store{
    width: 93%;
    left:1%;
}
.s-box{
    font-size:3vw;
    width: 46%;
    height: 60vw;
}
.inter{
    height: 15em;
}
.inter img{
 width: 6%;
}
.ft_ccd{
	font-family: 'Sinhala MN', 'TimesNewRomanPSMT', serif;
}
.contact-box{
        font-size: 1.1em;
        width: 60%;
        display: block;
        margin: 1em auto;
        margin-bottom: 2em;
    }
.onsp{
    display:block;
}
.offsp{
    display: none;
    }
.footimg{
    width: 70%;
}
.cfex p{
    font-size:0.9em;
}
.fadein_.ani01{
    animation: ani01 1.8s linear;
    animation-fill-mode: forwards;
}
.fadein_.ani02{
    animation: ani02 2.2s linear;
    animation-fill-mode: forwards;
}
.under-tel{
    position: fixed;
    bottom:0;
    width: 100%;
    height: 5vh;
    color: #fff;
    background-color:#25364f;
    font-size:3vw;
    line-height: 1.4em;
    font-weight: bold;
    font-family: "游ゴシック体", "Yu Gothic", sans-serif;
    letter-spacing: 0.01em;
    z-index: 101;
    display: flex;
    justify-content: center;
    align-items: center;
}
.flow{
    padding:1em 0;
}
.flow p{
    margin-bottom: 0;
    line-height: 1.4em;
}
.allow{
        display: none;
    }
}

@keyframes ani01 {
  0%{
    opacity: 0;
    transform : translate(0, 1em);
  }
  50%{
    opacity: 0;
    transform : translate(0, 1em);
  }
  100% {
    opacity: 1;
    transform : translate(0, 0);
  }
}
@keyframes ani02 {
  0%{
    opacity: 0;
    transform : translate(0, 1em);
  }
  65%{
    opacity: 0;
    transform : translate(0, 1em);
  }
  100% {
    opacity: 1;
    transform : translate(0, 0);
  }
}
/* DRAWER MENU
    
***************************************************************************/

.hamburger {
  display : block;
  position: fixed;
  z-index : 100;
  top: 1.2vh;
  right : 4vw;
  width : 5vw;
  height: 5vw;
  cursor: pointer;
  text-align: center;
   z-index : 1000;
}
.hamburger span {
  display : block;
  position: absolute;
  width   : 5vw;
  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 span:nth-child(1) {
  top: 1vw;
}
.hamburger span:nth-child(2) {
  top: 2.5vw;
}
.hamburger span:nth-child(3) {
  top: 4vw;
}

/* ナビ開いてる時のボタン */
.hamburger.active span:nth-child(1) {
  top: 1.3vh;
  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: 1.3vh;
  background :#fff;
  -webkit-transform: rotate(45deg);
  -moz-transform   : rotate(45deg);
  transform        : rotate(45deg);
}

nav.globalMenuSp {
  position: fixed;
  z-index : -1;
  top  : -100vh;
  left : 0;
  color: #000;
  background-color:#fff;
  text-align: center;
  width: 100%;
  height:100vh;
  opacity: 0;
  transition: opacity .6s ease, visibility .6s ease;
  box-sizing: border-box;
  white-space: nowrap;
  z-index : 99;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-family: Futura, 'Futura PT', sans-serif;
  font-size:2vw;
  font-weight: 500;
}
nav.globalMenuSp ul {
  margin: 0 auto;
  padding: 0;
  width: 100%;
  font-size:2em;
    padding-bottom: 5em;
}

nav.globalMenuSp ul li {
  list-style-type: none;
  padding: 0;
  width: 100%;
  transition: .4s all;
  margin-bottom: 2em;
}
nav.globalMenuSp ul li:last-child {
  padding-bottom: 0;
}

nav.globalMenuSp ul li a {
  display: block;
  color: #000;
  text-decoration :none;
  pointer-events: none;
}

/* このクラスを、jQueryで付与・削除する */
nav.globalMenuSp.active {
  opacity: 100;
  z-index : 20;
    top:0;
}
nav.globalMenuSp.active ul li a {
  pointer-events: auto;
}

/* FLP2
***************************************************************************/

.flp2t{
        font-size:4.2vw;
        position: absolute;
        top:1em;
        text-align: center;
        font-weight: bold;
        color: #25364f;
        }
.flp2logo{
        width:31vw;
        position: absolute;
        top:3.6em;
        display: block;
        margin: auto;
        animation: animex 0.8s linear;
        }
.topboxflp2{
        font-size:1.6vw;
        font-weight: bold;
        line-height: 1.6em;
        background-color: #fff;
        padding: 0.6em 1.8em 0.6em 1.2em;
        position: absolute;
        bottom:1.5em;right:1.5em;
        font-family: serif;
        animation: anime4 1.2s linear;
        box-shadow: 0.1em 0.1em 0.2em rgba(0,0,0,0.2);
        background-image: url("../images/under-a.svg");
        background-repeat: no-repeat;
        background-size: 1em;
        background-position: 98% 95%;
        }
.pop{
    font-size:1.5vw;
    position: absolute;
    bottom:1em;left:2em;
    width:12em;
    filter: drop-shadow(0.1em 0.1em 0.2em rgba(0,0,0,0.4));
    animation: animepop 1.6s linear;
}

.flp2book{
    width: 40%;
    display: inline-block;
    margin: auto;
    margin-bottom: 0.5em;
}

.toph1{
    font-size:2.1vw;
}
.center-box{
        width:80%;
        margin: 5em auto; margin-top: 2em;
        display: flex;
        flex-wrap: wrap; 
        justify-content: center;
        align-items: center;
        }
.boxes{
        background-color: #fff;
        font-weight: 500;
        font-family: "游ゴシック体", "Yu Gothic", sans-serif;
        font-size:1.1vw;
        line-height: 1.4em;
        width: 29.5%;
        height: 5em;
        box-shadow: 2px 2px 6px 0 rgba(0, 0, 0, .2);
        margin: 0.5em 1%;
        display: table;
        border: 3px solid #25364f;
        background-image: url("../images/under-a.svg");
        background-repeat: no-repeat;
        background-size: 1em;
        background-position: 99% 96%;
        transition: 0.5s;
        }
.boxes strong,modal_content strong{
        color:#25364f;
        font-weight: bold;
        }
.boxes:hover{
        opacity: 0.4;
        }
.boxes br{
        display: none;
    }
.boxes label{
        color: #000;
        width: 100%;
        height: 100%;
        cursor: pointer;
        display: table-cell;
        vertical-align: middle;
        text-align: center;
         }
.modal_wrap input{
  display: none;
        }

.modal_overlay{
  display: flex;
  justify-content: center;
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.5);
  opacity: 0;
  transition: opacity 0.5s, transform 0s 0.5s;
  transform: scale(0);
}

.modal_trigger{
  position: absolute;
  width: 100%;
  height: 100%;
}

.modal_content{
  align-self: center;
  width:40em;
  border-radius: 0.5em;
  max-width: 1200px;
  padding: 2em 2em 1em 2em;
  box-sizing: border-box;
  background: #fff;
  line-height: 1.4em;
  transform: scale(1.1);
  transition: 0.35s;
}
.modal_content h3{
    font-size: 1.6em;
    font-family: "游ゴシック体", "Yu Gothic", sans-serif;
    }
.modal_content p{
    text-indent: -2em;
    margin-left: 2em;
    line-height: 1.8em;
    margin-bottom: 1em;
    }
    
.close_button{
  position: absolute;
  top: 14px;
  right: 16px;
  font-size: 24px;
  cursor: pointer;
}

.modal_wrap input:checked ~ .modal_overlay{
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.5s;
}

.modal_wrap input:checked ~ .modal_overlay .modal_content{
  transform: scale(1);
}
    
@keyframes animex {
	0% {opacity: 0;}
	20% {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes anime4{
	0% {opacity: 0;bottom:0;}
	60% {opacity: 0;}
	100% {opacity: 1;bottom:1.5em;}
}
@keyframes anime5{
	0% {opacity: 0;bottom:-1em;}
	80% {opacity: 0;}
    90% {bottom: 1.2em;}
	100% {opacity: 1;bottom:1em;}
}
.bookpop{
    display: none;
}

@media screen and (orientation: portrait) {
.topcopy{
        bottom:0;
    }
h1{
    font-size:7.5vw;
    line-height: 1.2em;
    padding-top: 0;
    margin-bottom: 0;
}
.topcopy h2{
    font-size:2.8vw;
    line-height: 1.7em;
    padding: 1em 2em 2em 2em;
    text-align: justify;
}
.topcopy h2 br{
    display: none;
}
.pop{
    display: none;
        }
.bookpop{
    width: 90%;
    margin: auto;
    margin-top: -2em;
    display: block;
    border: 0.3em solid #25364f;
    padding: 1em 2em;
    text-align: center;
    box-sizing: border-box;
    background-color: #fff;
}
.bookpop img{
    width: 70%;
    margin: auto;
}
#sec01{
    padding-top:5em;
}

    h3{
        font-size:1.65em;
        line-height: 1.5em;
        padding-bottom: 0.2em;
    }
    .center-box{
        width:96%;
    }
    .boxes{
        width: 45%;
        font-size:3.5vw;
        height: 4em;
        border: 0.2em solid #25364f;
    }
    .boxes br{
        display: block;
    }
    .modal_content{
        width: 96%;
        font-size:2.6vw;
    }
    .modal_content p{
        font-size:1.3em;
        line-height: 1.6em;
    }
    .side-l{
        width: 100%;
    }
    .office{
    font-size:1.1em;
    width: 100%;
    }
    #sec07 dt{
        width: 8em;
        text-align: left;
        padding-left:2em;
        box-sizing:border-box;
        white-space: nowrap;
    }
    #sec07 dt.prof{
        display: none;        
    }
    #sec07 dd.prof{
        width: 100%;
        padding-left:2em;
        padding-right:2em;
        box-sizing:border-box;
    }
    .office{
    font-size:1.1em;
    width: 100%;
    }
    footer {
	clear:both;
    }
    .footmenu {
    padding: 1em 1.5em;        
    }
    .totop {
    width:8vw;
    right:2vw;
	bottom:3vh;
}
    .copyright img{
    display: block;
    margin: 2em auto !important;
    margin-top: 1em !important;
}
    
}