/* body */
body{margin:0;padding:0;background:#fff;font-size:14px;color:#222;font-family:"Open Sans","Noto Sans JP","ヒラギノ角ゴ","Hiragino Kaku Gothic","メイリオ","Meiryo",sans-serif;overflow-x:hidden;letter-spacing:0.1em;}
input,select,textarea,button{margin:0;padding:0;box-sizing:border-box;}
@media screen and (min-width:768px){
  body{padding:80px 0 0;}
}
@media screen and (max-width:767px){
  body{padding:75px 0 0;}
}
/* default */
header,nav,footer,section,aside,article,div,span,em,i,strong,h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,form,input,select,hr,button,a{margin:0;padding:0;box-sizing:border-box;}
ul,ol{list-style:none;}
i,em{font-style:normal;}
img{display:block;border:0;-ms-interpolation-mode:bicubic;}
a{color:#056;text-decoration:none;}
a:hover{opacity:0.8;}
a img:hover{opacity:0.8;}
sup{position:relative;top:-0.3em;font-size:60%;vertical-align:top;}
/* header */
header{line-height:0;position:fixed;top:0;left:0;background:#fff;box-shadow: 0px 1px 1px -1px rgba(0,0,0,0.2);width:100%;z-index:1;}
header div{position:relative;}
header h1{line-height:0;}
header h1 a{display:inline-block;}
@media screen and (min-width:768px){
  header div{margin:0 auto;padding:20px 30px;max-width:1084px;}
  header h1 img{height:40px;}
}
@media screen and (max-width:767px){
  header div{padding:20px;display:fixed;}
  header h1 img{height:35px;}
}
@media screen and (min-width:1024px){
  header p{display:none;}
}
@media screen and (max-width:1023px){
  header p{position:absolute;top:50%;right:10px;border-top:3px solid #888;border-bottom:3px solid #888;width:26px;height:22px;font-size:12px;line-height:20px;text-align:center;transform:translate(-50%,-50%);}
  header p:hover{opacity:0.8;}
  header p:after{position:absolute;top:50%;left:0;display:block;content:"";background:#888;width:100%;height:3px;transform:translate(0,-50%);}
}
/* nav */
nav a{display:block;color:#4c566c;}
@media screen and (min-width:1024px){
  nav{position:absolute;top:50%;right:0;transform:translate(0,-50%);}
  nav ul{letter-spacing:-0.5em;}
  nav ul li{display:inline-block;letter-spacing:0.1em;}
  nav ul li a{padding:0 10px;font-size:15px;line-height:20px;}
  nav ul li a.selected{color:#c22;}
}
@media screen and (min-width:768px) and (max-width:1023px){
  nav{position:absolute;top:80px;left:0;display:none;background:rgba(255,255,255,1);width:100%;z-index:1;}
  nav ul{border-top:1px solid #ccc;}
  nav ul li{border-bottom:1px solid #ccc;}
  nav ul li a{padding:0 10px;font-size:15px;line-height:40px;text-align:center;}
}
@media screen and (max-width:767px){
  nav{position:absolute;top:75px;left:0;display:none;background:rgba(255,255,255,1);width:100%;z-index:1;}
  nav ul{border-top:1px solid #ccc;}
  nav ul li{border-bottom:1px solid #ccc;}
  nav ul li a{padding:0 20px;font-size:13px;line-height:40px;text-align:center;}
}
/* article */
article{position:relative;background:url(../imgs/article/1.jpg) no-repeat center center;background-size:cover;}
article h2{position:absolute;top:50%;left:50%;line-height:1.4em;color:#222;text-align:center;transform:translate(-50%,-50%);}
article h2 span{color:#056;}
article h2 em{color:#c22;}
@media screen and (min-width:768px){
  article{height:40vw;}
  article h2{font-size:24px;}
  article h2 > *{margin:0 0 0 0.5em;}
}
@media screen and (max-width:767px){
  article{height:80vw;}
  article h2{font-size:18px;}
  article h2 > *{display:block;}
}
/* main */
main h2{line-height:1em;color:#056;text-align:center;}
main h2 span{color:#888;font-weight:normal;}
main h3{line-height:1em;color:#444;}
main p{line-height:1.8em;}
main p + p{margin:1em 0 0;}
main p small{display:block;padding:0 0 0 1em;line-height:1.4em;color:#888;text-indent:-1em;}
@media screen and (min-width:768px){
  main h2{margin:0 auto 40px;font-size:30px;}
  main h2 span{font-size:18px;}
  main h3{margin:0 0 30px;font-size:21px;}
  main p{font-size:15px;}
  main p small{font-size:13px;}
  main img[src*="sp"]{display:none !important;}
}
@media screen and (max-width:767px){
  main h2{margin:0 auto 30px;font-size:24px;}
  main h2 span{font-size:13px;}
  main h3{margin:0 0 20px;font-size:18px;text-align:center;}
  main p small{font-size:11px;}
  main img[src*="pc"]{display:none !important;}
}
/* section */
section:nth-of-type(even){background:#f8f8f8;}
section table{border-collapse:collapse;border-spacing:0;width:100%;}
section table tr > *{border:1px solid #ccc;line-height:1.4em;}
section table th{font-weight:normal;}
@media screen and (min-width:768px){
  section div{margin:0 auto;padding:80px 30px;max-width:1084px;}
  section table tr > *{padding:24px;font-size:15px;}
}
@media screen and (max-width:767px){
  section div{padding:60px 20px;}
  section table tr > *{padding:14px;font-size:13px;}
}
/* vision */
section.vision ul{letter-spacing:-0.5em;text-align:center;}
section.vision ul li{position:relative;display:inline-block;line-height:2.8em;color:#056;letter-spacing:0.1em;vertical-align:top;}
section.vision ul li span{position:absolute;top:1em;left:1em;display:block;line-height:1em;color:#888;}
section.vision ul li:last-child{line-height:1.4em;}
section.vision ul li img{display:block;margin:0 auto;width:100%;}
@media screen and (min-width:768px){
  section.vision ul{margin:40px 0 20px;}
  section.vision ul li{padding:20px 20px 0;width:25%;max-width:180px;font-size:15px;}
  section.vision ul li span{font-size:13px;}
  section.vision ul li img{margin:0 auto 20px;}
}
@media screen and (max-width:767px){
  section.vision ul{margin:30px auto 10px;padding:0 10px;max-width:380px;}
  section.vision ul li{padding:20px;width:50%;font-size:13px;}
  section.vision ul li span{font-size:10px;}
  section.vision ul li img{margin:0 auto 10px;}
}
/* issue */
section.issue h4{background:#f8f8f8;border-radius:1px;line-height:1.6em;color:#056;text-align:center;}
section.issue h4 em{color:#c22;}
section.issue ul{padding:0 0 0 2em;list-style:circle;line-height:1.6em;}
section.issue ul li + li{margin:0.5em 0 0;}
section.issue dl{text-align:center;}
section.issue dl > *{position:relative;}
section.issue dl > * > *{display:block;}
section.issue dl b{position:absolute;top:0;left:0;width:100%;line-height:1em;color:#056;}
section.issue dl b em{display:block;margin:1em 0 0;color:#222;font-weight:normal;}
section.issue dl span{margin:1em 0 0;line-height:1em;}
section.issue dl img{margin:0 auto;}
section.issue table tr > *{border:1px solid #fff;}
section.issue table thead td{background:#056;color:#fff;text-align:center;}
section.issue table tbody th{border:1px solid #056;}
section.issue table span{display:block;}
section.issue p img{margin:0 auto;}
@media screen and (min-width:768px){
  section.issue h4{margin:0 0 60px;padding:30px;font-size:18px;}
  section.issue ul{font-size:15px;}
  section.issue dl{margin:40px auto;letter-spacing:-0.5em;}
  section.issue dl > *{display:inline-block;padding:50px 40px 0;width:50%;letter-spacing:0.1em;vertical-align:top;}
  section.issue dl b{margin:0 0 20px;font-size:18px;}
  section.issue dl b em{font-size:15px;}
  section.issue dl span{font-size:15px;}
  section.issue dl img{max-width:380px;}
  section.issue p{margin:40px auto 0;}
  section.issue p img{max-width:960px;}
}
@media screen and (max-width:767px){
  section.issue h4{margin:0 0 30px;padding:20px;font-size:15px;}
  section.issue h4 br{display:none;}
  section.issue ul{font-size:13px;}
  section.issue dl{margin:30px auto;}
  section.issue dl > *{padding:40px 0 0;}
  section.issue dl > * + *{margin:30px 0 0;}
  section.issue dl b{margin:0 0 10px;font-size:15px;}
  section.issue dl b em{font-size:13px;}
  section.issue dl span{font-size:13px;}
  section.issue dl img{width:calc(100% - 20px);max-width:360px;}
  section.issue p{margin:20px auto 0;}
  section.issue p img{max-width:360px;}
}
/* service */
section.service p span{display:block;padding:0 0 0 1em;line-height:1.4em;text-indent:-1em;}
section.service p img{display:block;margin:0 auto;}
@media screen and (min-width:768px){
  section.service p img{margin:40px auto;max-width:960px;}
  section.service p:last-of-type img{margin-bottom:0;}
}
@media screen and (max-width:767px){
  section.service p img{margin:20px auto;max-width:360px;}
  section.service p:last-of-type img{margin-bottom:0;}
}
/* member */
.member ul{line-height:1em;text-align:center;}
.member ul li img{border-radius:1px;}
.member ul li span{display:block;line-height:1em;color:#888;}
@media screen and (min-width:768px){
  .member ul{letter-spacing:-0.5em;}
  .member ul li{display:inline-block;margin:0 20px;font-size:21px;letter-spacing:0.1em;}
  .member ul li img{margin:0 auto 20px;width:180px;}
  .member ul li span{margin:0 auto 12px;font-size:15px;}
}
@media screen and (max-width:767px){
  .member ul li{font-size:18px;}
  .member ul li + li{margin:30px 0 0;}
  .member ul li img{margin:0 auto 15px;width:150px;}
  .member ul li span{margin:0 auto 10px;font-size:13px;}
}
/* about */
section.about table th{background:#f8f8f8;}
section.about table ul{padding:0 0 0 2em;list-style:circle;}
section.about table ul li + li{margin:0.2em 0 0;}
section.about table ul li em{display:block;}
@media screen and (min-width:768px){
  section.about table th{width:20%;}
  section.about table td{width:80%;}
}
@media screen and (max-width:767px){
  section.about table{border-top:1px solid #ccc;}
  section.about table tr > *{display:block;border-top:0;}
}
/* news */
section.news ul li b{display:inline-block;padding:0 0.5em 0 1em;background:#fff;border:1px solid #056;border-radius:1px;line-height:2.5em;color:#056;}
section.news ul li em{color:#888;font-weight:normal;}
section.news ul li span{display:block;padding:0.5em 0 0;line-height:1.8em;}
@media screen and (min-width:768px){
  section.news ul li + li{margin:20px 0 0;}
  section.news ul li b{font-size:13px;}
  section.news ul li em{font-size:12px;}
  section.news ul li span{font-size:15px;}
}
@media screen and (max-width:767px){
  section.news ul li + li{margin:15px 0 0;}
  section.news ul li b{font-size:11px;}
  section.news ul li em{font-size:10px;}
  section.news ul li span{font-size:13px;}
}
/* footer */
footer{background:#222;color:#fff;}
footer a{color:#fff;}
footer p{text-align:center;}
footer ul{letter-spacing:-0.5em;line-height:1em;text-align:center;}
footer ul li{display:inline-block;letter-spacing:0;}
footer ul li .far{margin:0 0.5em 0 0;}
@media screen and (min-width:768px){
  footer div{margin:0 auto;padding:40px 0;max-width:1024px;}
  footer p{font-size:15px;}
  footer ul{margin:0 auto 20px;}
  footer ul li{margin:0 10px;font-size:15px;line-height:1em;}
}
@media screen and (max-width:767px){
  footer div{padding:30px 20px;}
  footer p{font-size:13px;}
  footer ul{margin:0 auto 15px;}
  footer ul li{margin:0 5px;font-size:13px;line-height:1em;}
}
