@charset "utf-8";

/* ----------------------------------------------------------------
Reset
----------------------------------------------------------------- */

body,div,dl,dt,dd,ul,li,h1,h2,h3,h4,h5,h6,p,a { margin: 0; padding: 0; }
img { border: 0; }
li,dt,dd { list-style: none; }

/* ----------------------------------------------------------------
Common
----------------------------------------------------------------- */

html {
font-size: 62.5%;
}

body {
text-align: center;
color: #111;
background: #fff;
font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
font-style: normal;
font-size: 1.6rem;
line-height: 3rem;
font-weight: normal;
margin: 0 auto;
}

img {
width: 100%;
vertical-align: top;
}

.sp {
display: none;
}

/* ----------------------------------------------------------------
Header
----------------------------------------------------------------- */

#header {
width: 100%;
margin: 0 auto;
padding: 0;
}

#header .inner {
width: 90%;
max-width: 1000px;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-align-items: center;
align-items: center;
margin: 0 auto;
padding: 0;
}

/* ----------------------------------------------------------------
Logo
----------------------------------------------------------------- */

#logo {
text-align: left;
width: 60%;
max-width: 600px;
margin: 0 auto;
padding: 38px 0 30px 0;
}

#logo img {
width: 100%;
}

#logo p {
font-size: 1.4rem;
line-height: 2.2rem;
margin: -12px 0 0 75px;
}

#logo a:link, #logo a:visited {
color: #222;
text-decoration: none;
}

#logo a:active, #logo a:hover {
color: #999;
text-decoration: none;
}

/* ----------------------------------------------------------------
search
----------------------------------------------------------------- */

#search {
width: 40%;
}

#search form {
text-align: right;
margin: 0 0 0 auto;
}

#search form input {
width: 20rem;
padding: 10px;
}

#search form input[type=submit] {
width: 8rem;
padding: 10px;
}

#search form button {
padding: 10px;
margin-left: 10px;
}

/* ----------------------------------------------------------------
Navi
----------------------------------------------------------------- */

#navi {
position: relative;
width: 100%;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
margin: 0 auto;
padding: 0;
}

#navi ul {
width: 100%;
max-width: 1000px;
margin: 0 auto;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-align-items: flex-start;
align-items: flex-start;
border-left: 1px solid #eee;
}

#navi li {
width: calc(100%/7);
box-sizing: border-box;
margin: 0 auto;
padding: 0 10px 0 10px;
border-right: 1px solid #eee;
}

#navi li img {
width: 90%;
}

#navi a:hover img {
opacity: 0.7;
}

/* ----------------------------------------------------------------
Hero
----------------------------------------------------------------- */

#hero {
position: relative;
width: 100%;
background: url("../image/hero02.jpg") 0 -600px no-repeat;
background-size: cover;
margin: 0 auto;
padding: 100px 0;
}

#hero.top {
position: relative;
width: 100%;
background: url("../image/hero02.jpg") top center no-repeat;
background-size: cover;
background: #f3d2cd;
margin: 0 auto;
padding: 0;
}

#hero h1 {
color: #222;
font-size: 3rem;
letter-spacing: 0.1rem;
line-height: 2.8rem;
font-weight: bold;
margin: 0 auto;
}

#hero h1 span {
font-size: 1.8rem;
}

#hero p {
width: 100%;
max-width: 1000px;
margin: 0 auto;
}

#hero.top a:hover img {
opacity: 0.9;
}

/* ----------------------------------------------------------------
Bnr
----------------------------------------------------------------- */

#bnr {
position: relative;
width: 100%;
background: url("../image/hero02.jpg") 0 -200px no-repeat;
background-size: cover;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
margin: 0 auto;
padding: 0;
}

#bnr ul {
width: 100%;
max-width: 1000px;
margin: 0 auto;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-align-items: flex-start;
align-items: flex-start;
}

#bnr li {
width: calc(100%/3);
box-sizing: border-box;
margin: 0 auto;
padding: 0;
}

#bnr a:hover img {
opacity: 0.9;
}

/* ----------------------------------------------------------------
Footer
----------------------------------------------------------------- */

#footer {
width: 100%;
border-top: 1px solid #ddd;
padding: 40px 0;
}

#footer a:link, #footer a:visited {
color: #111;
text-decoration: none;
}

#footer a:active, #footer a:hover {
color: #555;
text-decoration: none;
}

#footer-logo {
width: 430px;
margin: 0 auto;
}

#footer-navi {
margin: 30px auto;
}

#footer-navi span {
color: #ccc;
margin: 0 15px;
}

#footer-text {
width: 90%;
margin: 0 auto 30px auto;
}

#footer-text p {
font-size: 1.2rem;
line-height: 1.6rem;
font-family: Montserrat,"Helvetica Neue",sans-serif;
}

#footer-copyright p {
font-size: 1.1rem;
font-family: Montserrat,"Helvetica Neue",sans-serif;
letter-spacing: 0.1rem;
}

/* ----------------------------------------------------------------
Main
----------------------------------------------------------------- */

#main {
text-align: left;
position: relative;
width: 100%;
max-width: 1000px;
margin: 60px auto;
padding: 0;
}

#main a:link, #main a:visited {
color:#06c;
text-decoration: underline;
}

#main a:hover, #main a:active {
color:#398cde;
text-decoration: underline;
}

p {
word-break: break-all;
font-size: 1.6rem;
line-height: 2.6rem;
}

#main a:hover img {
opacity: 0.8;
}

#main #icon ul {
width: 100%;
margin: 0 auto;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-align-items: flex-start;
align-items: flex-start;
}

#main #icon li {
width: calc(100%/4);
box-sizing: border-box;
margin: 0 auto;
padding: 3px;
}

#main #news {
text-align: left;
margin: 0 auto 60px auto;
}

#main #news h2 {
font-size: 2.2rem;
line-height: 2.2rem;
font-weight: normal;
background: #f9e1de;
padding: 25px 30px;
border-radius: 10px;
box-sizing: border-box;
}

#main #news ul {
border-top: 1px solid #eee;
}

#main #news li {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-align-items: center;
align-items: center;
border-bottom: 1px solid #eee;
padding: 20px 0 20px 30px;
box-sizing: border-box;
}

#main #news li .date {
width: 140px;
}

#main #news li .category {
font-size: 1.3rem;
color: #dd3333;
font-weight: normal;
text-align: center;
width: 160px;
border: 1px solid #dd3333;
border-radius: 20px;
box-sizing: border-box;
padding: 3px 10px;
margin-right: 30px;
}

#main #news li .title {
}

/* ----------------------------------------------------------------
Law
----------------------------------------------------------------- */

.law h3 {
font-size: 2rem;
line-height: 2rem;
font-weight: bold;
background: #fdeff5;
padding: 25px 40px;
border-radius: 10px;
box-sizing: border-box;
margin-bottom: 30px;
}

#main.law p {
font-size: 1.6rem;
line-height: 2.4rem;
margin: 0 0 60px 40px;
}

/* ----------------------------------------------------------------
Book
----------------------------------------------------------------- */

.book .item {
width: 100%;
border-radius: 10px;
border: 1px solid #ddd;
margin: 0 auto 60px auto;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-align-items: flex-start;
align-items: flex-start;
padding: 20px 30px;
box-sizing: border-box;
}

.book .item .thumb {
width: 40px;
}

.book .item .thumb img {
width: 80%;
}

.book .item .info {
width: calc(100% - 70px);
}

.book .item h3 {
font-size: 2rem;
line-height: 3rem;
margin-bottom: 20px;
padding-top: 2px;
}

.book .item .note {
font-size: 1.5rem;
line-height: 2.5rem;
color: #111;
background: #f5f5f5;
border-radius: 10px;
margin-top: 20px;
padding: 20px 30px;
box-sizing: border-box;
}

.book p.author {
font-size: 1.5rem;
}

.book p.publisher {
font-size: 1.5rem;
}

/* ----------------------------------------------------------------
paper
----------------------------------------------------------------- */

.paper .item {
width: 100%;
border-radius: 10px;
border: 1px solid #ddd;
margin: 0 auto 60px auto;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-align-items: flex-start;
align-items: flex-start;
padding: 20px 30px;
box-sizing: border-box;
}

.paper .item .thumb {
width: 45px;
}

.paper .item .info {
width: calc(100% - 70px);
}

.paper .item h3 {
font-size: 2rem;
line-height: 3rem;
margin-bottom: 20px;
}

.paper .item .note {
font-size: 1.5rem;
line-height: 2.5rem;
color: #111;
background: #f5f5f5;
border-radius: 10px;
margin-top: 20px;
padding: 20px 30px;
box-sizing: border-box;
}

.paper p.author {
font-size: 1.5rem;
}

/* ----------------------------------------------------------------
case
----------------------------------------------------------------- */

.case .filter {
width: 100%;
background: #f7f7f7;
border-radius: 10px;
margin: 0 auto 60px auto;
padding: 30px 20px;
box-sizing: border-box;
}

.case .filter p {
text-align: center;
font-weight: bold;
margin: 0 auto 10px auto;
}

.case .filter ul {
margin: 0 auto 20px auto;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: center;
justify-content: center;
-webkit-align-items: center;
align-items: center;
}

.case .filter li {
margin: 0 5px 10px 5px;
}

.case .filter li a {
display: inline-block;
height: 40px;
line-height: 40px;
border-radius: 20px;
font-weight: bold;
padding: 0 20px;
background: #f9e1de;
}

.case .filter li.current a {
color: #fff;
background: #f2aba2;
}

#main.case .filter li a:link,
#main.case .filter li a:visited {
color: #222;
text-decoration: none;
}

#main.case .filter li a:hover {
color: #fff;
background: #f2aba2;
}

#main.case .filter li.current a:link,
#main.case .filter li.current a:visited {
color: #fff;
text-decoration: none;
}

.case .filter form {
text-align: center;
margin: 0 auto;
}

.case .filter form input {
width: 20rem;
padding: 10px;
}

.case .filter form input[type=submit] {
width: 8rem;
padding: 10px;
}

.case .filter form button {
padding: 10px;
margin-left: 10px;
}

.case .item {
width: 100%;
border-radius: 10px;
border: 1px solid #ddd;
margin: 0 auto 60px auto;
padding: 20px 30px 0 30px;
box-sizing: border-box;
}

.case .item .title {
width: 100%;
}

.case .item .content {
width: 100%;
}

.case h2 {
font-size: 2rem;
line-height: 2rem;
font-weight: bold;
background: #f9e1de;
padding: 25px 40px;
border-radius: 10px;
box-sizing: border-box;
margin-bottom: 30px;
}

.case h2:nth-of-type(2) {
margin-top: 60px;
}

.case .item h3 {
font-size: 1.8rem;
line-height: 5rem;
font-weight: bold;
border-left: 5px solid #eb6ea5;
margin-bottom: 20px;
padding-left: 15px;
}

.case h4 {
text-align: center;
font-size: 1.8rem;
line-height: 3rem;
font-weight: normal;
margin: 0 auto 20px auto;
}

.case .issue span {
font-weight: bold;
background:linear-gradient(transparent 60%, #fbd0bd 70%);
}

.case dl {
margin: 0 auto 10px auto;
}

.case dt {
font-weight: bold;
background: #fbeae8;
padding: 10px 20px;
}

.case dd {
padding: 10px 20px;
}

/* ----------------------------------------------------------------
Link
----------------------------------------------------------------- */

.link h2 {
font-size: 2rem;
line-height: 2rem;
font-weight: bold;
background: #f9e1de;
padding: 25px 40px;
border-radius: 10px;
box-sizing: border-box;
margin-bottom: 30px;
}

.link h2:nth-of-type(2) {
margin-top: 60px;
}

.link h3 {
font-size: 1.6rem;
line-height: 5rem;
font-weight: bold;
border-left: 5px solid #eb6ea5;
margin-bottom: 30px;
padding-left: 30px;
}

.link h3:nth-of-type(2) {
margin-top: 40px;
}

.link h4 {
font-size: 1.6rem;
line-height: 1.6rem;
font-weight: normal;
margin: 0 0 5px 40px;
}

#main.link p {
font-size: 1.4rem;
font-weight: normal;
margin: 0 0 40px 40px;
}

/* ----------------------------------------------------------------
About
----------------------------------------------------------------- */

.about h2 {
font-size: 2rem;
line-height: 2rem;
font-weight: bold;
background: #f9e1de;
padding: 25px 40px;
border-radius: 10px;
box-sizing: border-box;
margin-bottom: 30px;
}

.about h2:nth-of-type(2) {
margin-top: 60px;
}

#main.about p.indent {
padding-left: 40px;
}

.about .item {
width: 100%;
border-radius: 10px;
border: 1px solid #ddd;
margin: 0 auto 60px 40px;
padding: 30px 30px;
box-sizing: border-box;
}

.about h3 {
font-size: 1.8rem;
line-height: 5rem;
font-weight: bold;
border-left: 5px solid #eb6ea5;
margin-bottom: 30px;
padding-left: 30px;
}

.about h3:nth-of-type(2) {
margin-top: 60px;
}

.about h4 {
font-size: 2rem;
line-height: 3rem;
font-weight: bold;
margin-bottom: 20px;
padding-top: 2px;
}

#main.about p {
margin: 0 0 20px 0;
}

#main.about p.link {
margin: 0 0 5px 0;
}

#main.about p.addition {
font-size: 1.2rem;
line-height: 2.2rem;
margin: 10px 0 0 0;
}

.about .note {
font-size: 1.5rem;
line-height: 2.5rem;
color: #111;
background: #f5f5f5;
border-radius: 10px;
margin: 20px auto 20px auto;
padding: 20px 30px;
box-sizing: border-box;
}

/* ----------------------------------------------------------------
news
----------------------------------------------------------------- */

.news h2 {
font-size: 2rem;
line-height: 2rem;
font-weight: bold;
background: #f9e1de;
padding: 25px 40px;
border-radius: 10px;
box-sizing: border-box;
margin-bottom: 30px;
}

.news .item {
width: 100%;
border-radius: 10px;
border: 1px solid #ddd;
margin: 0 auto 60px auto;
padding: 20px 30px;
box-sizing: border-box;
}

.news .item h3 {
font-size: 1.6rem;
line-height: 5rem;
font-weight: bold;
border-left: 5px solid #eb6ea5;
margin-bottom: 20px;
padding-left: 15px;
}

/* ----------------------------------------------------------------
Research
----------------------------------------------------------------- */

.research h2 {
font-size: 2rem;
line-height: 2rem;
font-weight: bold;
background: #f9e1de;
padding: 25px 40px;
border-radius: 10px;
box-sizing: border-box;
margin-bottom: 30px;
}

.research h2:nth-of-type(2) {
margin-top: 60px;
}

.research h3 {
font-size: 2rem;
line-height: 5rem;
font-weight: bold;
border-left: 5px solid #eb6ea5;
margin-bottom: 30px;
padding-left: 30px;
}

.research h3:nth-of-type(2) {
margin-top: 90px;
}

.research h4 {
font-size: 1.8rem;
line-height: 2.4rem;
font-weight: normal;
margin: 0 0 20px 40px;
margin-top: 40px;
}

.research h4:nth-of-type(2) {
}

#main.research p {
margin: 0 0 30px 40px;
}

#main.research p span {
font-weight: bold;
background:linear-gradient(transparent 60%, #fbd0bd 70%);
}

#main.research table {
margin: 0 0 40px 40px;
border-collapse: collapse;
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
}

#main.research table th {
font-size: 1.6rem;
box-sizing: border-box;
padding: 15px;
background: #f9e1de;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}

#main.research table th:nth-of-type(2) {
width: 8rem;
text-align: center;
}

#main.research table td {
font-size: 1.5rem;
line-height: 2rem;
box-sizing: border-box;
padding: 15px;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}

#main.research table td:nth-of-type(2) {
text-align: center;
}

/* ----------------------------------------------------------------
search
----------------------------------------------------------------- */

.search h2 {
font-size: 2rem;
line-height: 2rem;
font-weight: bold;
background: #f9e1de;
padding: 25px 40px;
border-radius: 10px;
box-sizing: border-box;
margin-bottom: 30px;
}

.search h3 {
font-size: 1.6rem;
line-height: 2rem;
font-weight: bold;
margin-bottom: 5px;
}

.search article {
margin-bottom: 30px;
}












@media screen and (max-width: 800px) {

.sp {
display: block;
}

#logo {
text-align: left;
width: 94%;
margin: 0 auto;
padding: 20px 0 15px 0;
}

#logo img {
width: 95%;
}

#logo p {
width: 85%;
color: #777;
font-size: 1.1rem;
line-height: 2rem;
margin: -17px 0 0 12%;
}

#logo p br {
display: none;
}

#logo a:link, #logo a:visited {
color: #222;
text-decoration: none;
}

#logo a:active, #logo a:hover {
color: #999;
text-decoration: none;
}

#search {
text-align: center;
width: 94%;
margin: 0 auto 20px auto;
}

#search form {
text-align: center;
margin: 0 auto;
}

#search form input {
width: 20rem;
padding: 10px;
}

#search form input[type=submit] {
width: 8rem;
padding: 10px;
}

#search form button {
padding: 10px;
margin-left: 10px;
}




#navi {
position: relative;
width: 100%;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
margin: 0 auto;
padding: 0;
}

#navi ul {
width: 100%;
margin: 0 auto;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-align-items: flex-start;
align-items: flex-start;
box-sizing: border-box;
border-left: 1px solid #eee;
}

#navi li {
width: calc(100%/7);
box-sizing: border-box;
margin: 0 auto;
padding: 0 3px;
border-right: 1px solid #eee;
}

#hero {
position: relative;
width: 100%;
background: url("../image/hero02.jpg") 0 0 no-repeat;
background-size: cover;
margin: 0 auto;
padding: 100px 0;
}

#hero.top {
position: relative;
width: 100%;
background: url("../image/hero02.jpg") top center no-repeat;
background-size: cover;
background: #f8e8f0;
margin: 0 auto;
padding: 0;
}

#hero h1 {
font-size: 2.2rem;
line-height: 2.2rem;
font-weight: bold;
margin: 0 auto;
}

#hero h1 span {
font-size: 1.8rem;
}

#main {
text-align: left;
position: relative;
width: 96%;
margin: 60px auto;
padding: 0;
}

#main #news li {
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}

#main #news li .date {
width: 120px;
}

#main #news li .title {
width: 100%;
padding-top: 10px;
}

#hero p {
width: 100%;
max-width: 100%;
margin: 0 auto;
}

#footer-logo {
width: 80%;
margin: 0 auto;
}

#footer-navi {
width: 90%;
font-size: 1.1rem;
margin: 30px auto;
}

#footer-navi p {
font-size: 1.2rem;
}

#footer-navi span {
color: #ccc;
margin: 0 10px;
}

}