@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Open+Sans);

html {
  font-size: 87.5%;
  /*14px*/
  line-height: 2;
  /*28x*/
  color: #666;
  font-family: 'Open Sans', 'Hiragino Kaku Gothic Pro', 'Yu Gothic', 'Meiryo', 'MS PGothic', sans-serif;
  -webkit-text-size-adjust: 100%;
  background: white;
}

body, ul, ol {
  margin: 0;
  padding: 0;
}

img {
  max-width: 100%;
  height: auto;
  transition: .5s;
}

img, iframe {
  vertical-align: bottom;
}

a img:hover {
  opacity: .75;
}

.contents {
  width: 91.6666%;
  margin: 0 auto;
  padding: 1.5em 0;
}

li {
  list-style-position: inside;
}

section {
  margin: 1.5em 0;
}

video {
  width: 100%;
}

/* -- bg -- */
.b_red, .b_red a, .b_blue, .b_blue a, .b_dblue, .b_dblue a {
  color: white;
}

.b_blue, a.b_blue {
  background-color: #0c4798;
}

a.b_blue, a.b_sky {
  display: block;
  width: 100%;
}

.b_dblue, a.b_blue:hover {
  background-color: #003255;
}

.b_sky, a.b_sky {
  background-color: #e1f5ff;
}

.b_red {
  background-color: #C00;
}

.b_pink {
  background-color: #FCC;
}

.b_white {
  background-color: white;
}

a.b_sky {
  color: #003255;
}

a.b_sky:hover {
  background-color: white;
}

.bold {
  color: black;
  font-weight: 600;
}

/*--cta--*/
a.cta {
  display: block;
  color: black;
  border: .125em solid black;
  background-color: yellow;
  -webkit-transition: color .3s, background-color .3s, box-shadow .3s, -webkit-transform .3s;
  transition: color .3s, background-color .3s, box-shadow .3s, transform .3s;
}

a.cta:hover {
  color: yellow;
  background-color: black;
  -webkit-transform: translateY(.125em);
  transform: translateY(.125em);
}

/* -- waku -- */
.waku, .waku_blue {
  padding: 1.5em 4.1666%;
}

.waku {
  border: 1px solid #eee;
  text-shadow: 1px 2px 3px #808080;
}

.waku_blue {
  border: 1px solid #0c4798;
}

/* -- line&fukidasi -- */
.l_blue {
  padding-bottom: .25em;
  color: #0c4798;
  border-bottom: 1px solid #0c4798;
}

/* -- font -- */
h1 {
  font-size: 175%;
  /*28px*/
  line-height: 1.2857;
  /*36px*/
}

h2 {
  font-size: 150%;
  /*24px*/
  line-height: 1.5;
  /*36px*/
}

h3 {
  font-size: 125%;
  /*20px*/
  line-height: 1.8;
  /*36px*/
}

a {
  color: #0c4798;
  text-decoration: none;
  background: transparent;
}

strong {
  padding: 0 .25em;
}

.big {
  font-size: 175%;
}

.small {
  font-size: 75%;
}

.min {
  font-family: Times New Roman, A1 Mincho, YuMincho, Hiragino Mincho ProN, Meiryo, serif;
}

.blue {
  color: #0c4798;
}

.dblue {
  color: #0d2555;
}

.gray {
  color: gray;
}

.red {
  color: red;
}

/*--title--*/
.title {
  text-align: center;
  padding: .5em;
  box-sizing: border-box;
}

.text_r {
  text-align: right;
}

/*--icon--*/
.i_mail, .i_photo {
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  width: 1em;
  height: 1em;
  margin-right: .5em;
}

.i_mail {
  background-image: url(../images/i_mail.svg);
}

.i_photo {
  background-image: url(../images/i_photo.svg);
}

/*--col--*/
.col2 li, .col3 li, .col4 li {
  margin: .75em 2.5%;
  list-style: none;
  box-sizing: border-box;
  position: relative;
}

.col3 li img {
  margin: .75em 0;
}

.col4>li {
  float: left;
  width: 45%;
}

/*--float_kiji--*/
.float_l_kiji, .float_r_kiji {
  margin: 0 4.16665%;
  padding: .75em 0;
}

.float_l_img img, .float_r_img img {
  width: 100%;
}

/* --selection---*/
::selection {
  background: #eee;
}

::-moz-selection {
  background: #eee;
}

/*--menu--*/
#logo img {
  height: 3.5em;
  width: auto;
}

#header {
  margin: 0 auto;
  padding: .75em 0;
  text-align: center;
  font-size: 75%;
}

#header_menu {
  margin-top: 1.5em;
}

#header nav {
  display: none;
}

#header_menu li,
#header_menu_sub li {
  list-style: none;
  border-bottom: 1px solid gray;
  box-sizing: border-box;
  width: 50%;
  float: left;
}

#header_menu li a:before,
#header_menu li a:after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}

#header_menu li a,
#header_menu li a:before,
#header_menu li a:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}

#header_menu li a,
#header_menu_sub li a {
  display: block;
  color: black;
  padding: .75em 0;
}

#header_menu li a:hover {
  background-color: #e1f5ff;
}

#header_menu li a.active {
  background-color: #eee;
}

#header_menu_sub li:last-child {
  width: 100%;
}

#header_menu_sub li:last-child a {
  background-color: #0c4798;
  color: white;
}

#header_menu_sub li:last-child a:hover {
  background-color: #e60012;
}

.fixed {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 9990;
  border-bottom: 1px solid #eee;
  background-color: white;
  -webkit-animation-duration: 1s;
  -ms-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-30em);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-30em);
    -ms-transform: translateY(-30em);
    transform: translateY(-30em);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

/* ----- menubtn ----- */
.bar {
  width: 50%;
  height: 3%;
  -webkit-transition: all .5s;
  transition: all .5s;
  -webkit-transform-origin: left top;
  transform-origin: left top;
  background-color: white;
  position: relative;
}

#menu_btn:hover, .bar.top, .bar.middle, .bar.bottom {
  opacity: 1;
}

.bar.top {
  top: 15%;
}

.bar.middle {
  top: 30%;
}

.bar.bottom {
  top: 45%;
}

#menu_btn span {
  display: block;
}

#menu_btn {
  cursor: pointer;
  font-size: 66.6%;
  line-height: 2;
  width: 16.6666%;
  height: 6em;
  position: absolute;
  top: 0;
  right: 4.1666%;
  background-color: #0c4798;
  z-index: 9999;
  color: white;
}

#menu_btn p {
  position: absolute;
  text-align: center;
  bottom: -7.5%;
}

.bar, #menu_btn p {
  left: 25%;
  right: 25%;
}

#menu_btn a:hover {
  background-color: #888;
}

#page_top {
  right: 8.3333%;
  z-index: 9999;
}

/*--movie--*/
#movie_pc {
  display: none;
}

/*--top--*/
#top {
  background: url(../images/top01.jpg) no-repeat bottom center;
  background-size: cover;
  padding: 3em 0;
  border-bottom: .5em solid #0c4798;
  color: white;
  font-family: Georgia, 'Hiragino Mincho ProN', 'Yu Mincho', serif;
}

#top article {
  margin: 0 auto;
  width: 91.6666%;
  text-align: center;
  padding: 1.5em 0;
  border: 1px solid white;
}

#feeds dt {
  float: left;
  width: 25%;
}

#feeds dd {
  width: 75%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 2021/07/09 バナー追加 */
.banner-flex {
  display: block;
  text-align: center;
}

.banner-flex img {
  margin-bottom: 10px;
}

/* 2021/10/14 社労士マーク追加 */
.mark_section {
  display: flex;
  justify-content: center;
}

.mark_width {
  width: 80%;
}

.text-center {
  text-align: center;
}

/*--bg img--*/
.bg img {
  width: 100%;
}

/* --works---*/
#work li {
  list-style: none;
}

#work>li {
  background-color: white;
  box-shadow: .25em .25em .25em rgba(131, 187, 255, 0.6);
  border-radius: 1em;
  overflow: hidden;
  margin: 1.5em 5%;
}

#work>li h2 {
  width: 100%;
  position: relative;
  background-image: linear-gradient(-90deg, #251542, #007DD1);
  color: white;
  text-align: center;
  z-index: 2;
}

@media screen and (max-width: 1350px) {
  #work>li h2 {
    font-size: 120%;
  }
}

@media screen and (max-width: 740px) {
  #work>li h2 {
    font-size: 2.8vw;
  }
}

@media screen and (max-width: 639px) {
  #work>li h2 {
    font-size: 150%;
  }
}

#work>li li {
  float: left;
  font-size: 150%;
  /*24px*/
  line-height: 1.5;
  /*36px*/
  margin: 0 1em;
}

#work>li ul {
  margin: 1.5em 0;
}

#work>li li:before {
  content: '\025ce';
  padding-right: .5em;
  color: #0c4798;
}

/* --youtube---*/
.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}

.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

/* --jiko---*/
#jikoform input[type=datetime-local], #jikoform option,
#jikoform input[type=text], #jikoform input[type=email],
#jikoform input[type=tel], #jikoform input[type=name],
#jikoform textarea, #jikoform select {
  margin: .75em 0;
}

#UraAddressMap {
  width: 100% !important;
  height: 24em !important;
  margin: 0 auto;
}

#mapDialog, #postalcode {
  display: none;
}

.jiko li {
  float: left;
  margin: .75em 4.1666%;
}

.jiko li, .jiko li>img,
.jiko li>section, .view_box img {
  float: left;
}

.jiko li>section {
  width: 70.8333%;
  overflow: hidden;
}

.jiko li>img,
.view_box img {
  height: auto;
  margin-right: 4.1666%;
}

.jiko li>img {
  width: 25%;
}

.view_box img {
  width: 12.5%;
}

.jiko li:after {
  content: '';
}

/* --table mail---*/
table {
  width: 100%;
  border-collapse: collapse;
  word-break: break-all;
  box-sizing: border-box;
}

table, th, td {
  border: 1px gray solid;
}

th, td {
  display: block;
}

th {
  background-color: #0c4798;
  padding: 1em 4.1666%;
  text-align: center;
  color: white;
}

td {
  padding: 1.5em 4.1666%;
}

td li {
  list-style: none;
  float: left;
}

td li:after {
  content: '／';
}

td li:last-child:after {
  content: '';
}

table th strong {
  margin-left: .5em;
  padding: .25em 1em;
  background-color: #e60012;
}

table br {
  display: none;
}

input[type=datetime-local], option,
input[type=text], input[type=email], input[type=tel], input[type=name], textarea, select {
  font-size: 125%;
  /*20px*/
  line-height: 2.1;
  /*42px*/
  padding: .75em 2.0833%;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

input[type=datetime-local], input[type=text], option,
input[type=email], input[type=name], input[type=tel], textarea, select {
  display: inline-block;
  width: 100%;
}

input[type=text].mini {
  width: 41.6666%;
}

input:focus::-webkit-input-placeholder,
textarea:focus::-webkit-input-placeholder {
  color: transparent;
}

input:focus::-moz-placeholder,
textarea:focus::-moz-placeholder {
  color: transparent;
}

input[type="button"], input[type="reset"], input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
  border: 0;
  color: white;
  padding: .375em 8.3333%;
  background-color: #e60012;
  border-radius: .25em;
}

input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover {
  background-color: #005aa0;
}

::-webkit-input-placeholder {
  /* WebKit browsers */
  color: #ccc;
  font-style: italic;
}

:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #ccc;
  font-style: italic;
}

::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #ccc;
  font-style: italic;
}

footer {
  font-size: 87.5%;
  position: relative;
  background: url(../images/b_sky.jpg) no-repeat;
  background-size: cover;
}

footer, footer a {
  color: white;
}

footer li {
  font-weight: 600;
}

footer li ul li {
  list-style: none;
  list-style-position: inside;
  text-shadow: 0 0 .5em #00223c;
}

footer li ul li ul {
  padding-bottom: 1.5em;
}

footer li ul li ul li {
  float: left;
  padding-right: 1em;
}

footer li ul li:before {
  content: '\025bc';
  padding-right: .5em;
}

footer li ul li ul li:before {
  content: '\0bb';
  padding-right: .5em;
}

/*--clear--*/
td ul:after, #logo:after, #header:after,
#header_menu_sub:after, #feeds:after, #com dd:after,
#work>li:after, #work>li ul:after, .jiko:after,
.float_l:after, .float_r:after,
.col2:after, .col3:after, .col4:after, .view_box:after,
footer li ul li ul:after {
  display: block;
  clear: both;
  content: ''
}

@media screen and (min-width:480px) {
  .contents {
    width: 83.3333%;
  }

  .col4>li {
    width: 20%;
  }

  /* --com---*/
  #com dt {
    float: left;
    width: 20.0833%;
    margin-right: 4.1666%;
    text-align: right;
  }

  #com dd {
    width: 75%;
    overflow: hidden;
  }
}

@media screen and (min-width:640px) {
  #header_menu li, #header_menu_sub li {
    width: 25%;
    float: left;
  }

  #header_menu_sub li:nth-child(n+2) {
    width: 50%;
  }

  #movie_sp {
    display: none;
  }

  #movie_pc {
    display: block;
  }

  #work>li {
    margin: 1.5em 2.5%;
  }

  #top article {
    width: 83.3333%;
  }

  .col3>li {
    width: 28.3333%;
  }

  .col2>li {
    width: 45%;
  }

  .col2>li, .col3>li {
    float: left;
  }

  footer li {
    display: block;
  }

  input[type="button"], input[type="reset"], input[type="submit"] {
    font-size: 125%;
  }

  .ui-widget.ui-widget-content {
    width: 95% !important;
    height: 95% !important;
  }
}

@media screen and (min-width:960px) {
  html {
    font-size: 93.75%;
    /*15px*/
    line-height: 2.5;
    /*45px*/
  }

  #menu_btn {
    display: none;
  }

  #logo {
    float: left;
  }

  #logo img {
    height: auto;
  }

  #header {
    width: 91.6666%;
    font-size: 100%;
  }

  #header_menu {
    margin-top: 3em;
    position: relative;
  }

  #header_menu:before {
    content: '';
    position: absolute;
    right: 0;
    top: -.75em;
    width: 100%;
    border-top: 1px solid #eee;
  }

  #header nav {
    display: block;
    float: right;
  }

  #header_menu li {
    vertical-align: middle;
    border-left: 1px solid #eee;
  }

  #header_menu li:first-child {
    border-left: none;
  }

  #header_menu:after {
    display: block;
    clear: both;
    content: ''
  }

  #header_menu li,
  #header_menu_sub li,
  #header_menu_sub li:nth-child(n+2),
  #header_menu_sub li:last-child {
    width: auto;
  }

  #header_menu li,
  #header_menu_sub li {
    border-bottom: none;
  }

  #header_menu_sub {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 87.5%;
    border: none;
  }

  #header_menu li a,
  #header_menu_sub li a {
    padding: 0 .75em;
  }

  #top {
    padding: 12em 0;
  }

  #top article {
    padding: 0;
  }

  #link li:last-child {
    border-right: 1px solid #eee;
  }

  #link li {
    border-left: 1px solid #eee;
  }

  #work {
    width: 75%;
    margin: 0 auto;
  }

  .float_l, .float_r {
    padding: 0;
  }

  .float_l_img, .float_r_img {
    width: 50%;
  }

  .float_l_kiji, .float_r_kiji {
    width: 37.5%;
    padding: .75em 4.1666%;
  }

  .float_l_kiji {
    margin: 0 0 0 4.1666%;
  }

  .float_r_kiji {
    margin: 0 4.1666% 0 0;
  }

  .float_r_img {
    float: right;
  }

  .float_l_kiji, .float_r_kiji, .float_l_img {
    float: left;
  }

  th, td {
    display: table-cell;
  }

  table th {
    width: 30%;
    color: white;
  }

  table br {
    display: inline-block;
  }

  table th strong {
    margin-left: 0;
  }

  /* 2021/07/09 バナー追加 */
  .banner-flex {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
  }

  .banner-flex img {
    width: 400px;
  }

  .center {
    margin: 0 auto;
    float: none;
  }
}

@media screen and (min-width:1280px) {
  html {
    font-size: 125%;
    /*24px*/
  }

  #top article {
    width: 42.5%;
  }

  #top h1 {
    line-height: 3;
  }

  .contents {
    width: 75%;
    padding: 3em 0;
  }

  input[type="button"], input[type="reset"], input[type="submit"] {
    font-size: 150%;
  }

  .ui-widget.ui-widget-content {
    width: 75% !important;
    height: 75% !important;
  }
}

@media screen and (min-width:1600px) {
  #header {
    width: 75%;
  }

  .contents {
    width: 66.6666%;
  }
}

@media screen and (min-width:320px) {
  .sp-br {
    display: block;
  }

  .leaflet {
    width: 80%;
  }

  .sp {
    display: block;
  }

  .pc {
    display: none;
  }

  .center-left {
    text-align: left;
  }

  .exp-sq {
    font-size: 100%;
    padding: 5%;
    border: 1px solid #fff;
    text-align: center;
  }

  .grid-nintei {
    text-align: center;
  }
}

@media screen and (min-width:630px) {
  .sp {
    display: none;
  }

  .footer-b li {
    height: 300px;
  }

  .footer-b img {
    width: 50% !important;
  }

  .nintei img {
    width: 65% !important;
  }

  .font-s {
    font-size: 70%;
  }
}

@media screen and (min-width:760px) {
  .exp-sq {
    font-size: 165%;
    padding: 13%;
    border: 1px solid #fff;
    text-align: center;
  }
}

@media screen and (min-width:960px) {
  .grid-nintei {
    text-align: left;
    width: 100%;
    display: grid;
    display: -ms-grid;
    grid-template-columns: 40% 60%;
    -ms-grid-column: 40% 60%;
  }

  .font-s {
    font-size: 80%;
  }
}

@media screen and (min-width:1024px) {
  .sp-br {
    display: none;
  }

  .leaflet {
    width: 45%;
  }

  .pc {
    display: block;
  }

  .center-left {
    text-align: center;
  }

  .exp-sq {
    font-size: 100%;
    padding: 10%;
    border: 1px solid #fff;
    text-align: center;
  }

  .footer-b li {
    height: 300px;
  }

  .nintei img {
    width: 75% !important;
  }
}

.nintei {
  margin: 0 auto;
}

.text-r {
  text-align: right;
}

@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
  .grid-nintei {
    display: -ms-grid;
    -ms-grid-columns: 40% 60%;
  }

  .nintei {
    -ms-grid-column: 1;
  }

  .nintei-p {
    -ms-grid-column: 2;
  }
}

.risk-footer li {
  height: auto !important;
}

@media screen and (min-width:370px) {
  .month-br {
    text-align: right;
    width: 22%;
  }
}

@media screen and (min-width:450px) {
  .month-br {
    text-align: right;
    width: 18%;
  }
}

@media screen and (min-width:480px) {
  .month-br {
    text-align: right;
    width: 20.0833%;
  }
}

/*20240321*/
.col li {
  margin: 0.75em 2.5%;
  list-style: none;
  box-sizing: border-box;
  position: relative;
}

.col2w {
  text-align: center;
}

.col2w ul {
  display: flex;
}

.col2w ul li {
  list-style: none;
  margin-left: 20px;
}

.col2w dd {
  margin-left: 0px;
}

@media screen and (min-width:640px) {
  .col>li {
    margin: 20px auto;
    text-align: center;
  }

  .col2w {
    padding: 20px;
    display: flex;
  }

  .col2w dt {
    width: 200px;
    padding: 10px;
    text-align: center;
    font-weight: 600;
  }

  .col2w dd {
    margin-top: 10px;
    margin-left: 30px;
    text-align: left;
  }
}

/*20241129*/
.iframe-wrapper,
.case_iframe-wrapper {
  position: relative;
  padding-bottom: 650px;
  height: 0;
}

.iframe-wrapper iframe,
.case_iframe-wrapper iframe  {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0px;
  overflow: hidden;
}

@media screen and (min-width:640px) {
  .iframe-wrapper {
    padding-bottom: 250px;
  }

  .case_iframe-wrapper {
    padding-bottom: 350px;
  }
}
