/*!
Theme Name: oitoma
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: oitoma
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

oitoma is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Poppins:wght@600&family=Questrial&display=swap');
/*リセット*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}
body {
  line-height:1;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
  display:block;
}
nav ul {
  list-style:none;
}
blockquote, q {
  quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content:'';
  content:none;
}
a {
  margin:0;
  padding:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}
/* change colours to suit your needs */
ins {
  background-color:#ff9;
  color:#000;
  text-decoration:none;
}
/* change colours to suit your needs */
mark {
  background-color:#ff9;
  color:#000; 
  font-style:italic;
  font-weight:bold;
}
del {
  text-decoration: line-through;
}
abbr[title], dfn[title] {
  border-bottom:1px dotted;
  cursor:help;
}
table {
  border-collapse:collapse;
  border-spacing:0;
}
/* change border colour to suit your needs */
hr {
  display:block;
  height:1px;
  border:0;   
  border-top:1px solid #ccc;
  margin:1em 0;
  padding:0;
}
input, select {
  vertical-align:middle;
}
p:empty {
   margin: 0;
   padding: 0;
}
/*基本指定*/
html{
  scroll-behavior: smooth;
}
img{
  max-width: 100%;
}
body{
  font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
  line-height:1.5;
  color: #333;
}

a{
  color: #333;
  text-decoration: none;
}
.link:visited{
  color: #333;
}

iframe{
  width: 100%;
  filter: grayscale(100%);
  transition: all 0.7s ease;
}
i{
  margin:0 5px;
}


p{
  padding: 10px 0;
}
/*ヘッダー*/
header{
  background: url(images/bg_header.png) no-repeat top/cover;;
}
.headerWrap{
  display: flex;
  justify-content: space-between;
 }
.headerWrap h1{
  padding: 10px;
  font-size: 1.2rem;
  letter-spacing: 0.3rem;
  display: flex;
  align-items: center;
}
.headerWrap h1 img{
  width: 24px;
}
.headerContents{
  text-align: center;
  line-height: 0;
}
.headerRibbon{
  width: 100%;
  background: #176184;
  text-align: center;
  color: #fff;
  padding: 20px 10px;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
}
.headerRibbon img{
  width: 24px;
  height: 24px;
  margin: 0 0 0 3px;
}
/*メイン*/
.contentsWrap02 h2,
.contentsWrap03 h2,
.contentsWrap04 h2,
.contentsWrap05 h2,
.contentsWrap06 h2,
.contentsWrap07 h2,
.contentsWrap08 h2,
.contentsWrap09 h2,
.contentsWrap10 h2{
  background: #176184;
  padding: 20px;
  border-radius: 10px;
  color: #fff;
  text-align: center;
  margin: 40px 10px 10px;
}
.contentsWrap05 h2,
.contentsWrap07 h2,
.contentsWrap09 h2{
  margin: 10px;
}
.contentsWrap10 h2{
  padding: 40px 10px 10px;
}
.contentsWrap01 h2{
  text-align: center;
  padding: 10px;
}
.contentsWrapInner01{
  border: 2px solid #841717;
  border-radius: 10px;
  padding: 10px;
  margin: 10px;
}
.contentsWrapInner01 p{
  text-align: center;
}
.contentsWrap02{
  background: #176184;
  margin: 30px 0 0;
  color: #fff;
  padding: 20px;
  text-align: center;
}
.contentsWrapInner01 i{
  text-align: center;
  font-size: 3.5rem;
display: block;
  color: #841717;
  margin: 0 0 20px;
}
.contentsWrapInner01 span{
  text-align: right;
  display: block;
}
.contentsWrap03{
  background: url(images/bg_01.png) no-repeat top/cover;
  padding: 10px;
}
.contentsBox03{
  background: #fff;
  border-radius: 5px;
  margin: 20px 10px;
  text-align: center;
  box-shadow: 4px 4px 10px 0px rgba(0, 0, 0, 0.4);
  padding: 0 20px;
}
.contentsBox03_02{
  display: flex;
flex-wrap: wrap;
}
.contentsBox03_03{
  background: #d0ebf8;
  text-align: center;
  padding: 10px;
  font-size: 0.9rem;
}
.itemBox03{
  background: #176184;
  color: #fff;
  padding: 5px 10px;
  margin: 10px;
  text-align: center;
  width: calc(50% - 20px);
  box-sizing: border-box;
}
.contentsBox04{
  background: url(images/bg_02.png) no-repeat top/cover;
}
.contentsBox04 ul{
  background: rgba(0,0,0,0.5);
  color: #fff;
  margin: 10px;
  width: 80%;
}
.contentsBox04 ul li{
  padding: 10px 10px 10px 2rem;
  list-style: none;
  position: relative;
}
.contentsBox04 ul li:before{
    position: absolute;
    left: 10px;
    font-family:'icomoon';
    content: "\e907";
    color: #fff;
}
.contentsBox04_02{
  text-align: center;
}
.contentsBox04_02 img{
  width: 120px;
  margin: 30px 0 0;
}
.contentsBox04_02 p{
  color: #f00;
  font-weight: 700;
}
.contentsWrap05{
  background: #c9defd;
  padding: 20px 10px;
}
.contentsBox05{
  display: flex;
  border: 2px solid #128abc;
  margin: 10px 0;
  align-items: center;
  background: #fff;
}
.boxImage05{
  width: 30%;
  font-size: 0.8rem;
  text-align: center;
  padding: 3px;
}
.boxTxt05{
  width: 70%;
  margin: 0 20px 0 10px;
}
.boxTxt05 h4{
  color: #128abc;
  padding: 10px 10px 5px 0;
}
.boxTxt05 dl{
  display: flex;
  flex-flow: row wrap;
  width: 100%;
  align-items: center;
  margin: 0 0 10px;
}
.boxTxt05 dt{
  flex-basis: 20%;
  background: #128abc;
  color: #fff;
  padding: 5px;
  margin: 5px 0 0;
  font-size: 0.8rem;
  text-align: center;
  box-sizing: border-box;
}
.boxTxt05 dd{
flex-basis: 80%;
  padding: 0 10px;
  box-sizing: border-box;
}
.contentsWrap07{
  background: #c9defd;
  padding: 30px 0;
}
.contentsBox07{
  margin: 20px 10px;
}
.contentsTxt07{
  background: #fff;
  padding: 20px 10px 10px;
  margin: 5px;
  border-radius: 10px;
}
.contentsTxt07 h4{
  color:#245baf;
}
.pointWrap07{
  background: #245baf;
  color: #fff;
  padding: 10px;
  font-weight: 700;
  margin: 5px;
  position: relative;
}
.pointWrap07::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 20%;
  border-style: solid;
  border-width: 13px 10px 0 10px;
  border-color: #245baf transparent transparent;
  translate: -50% 100%;
}
.contentsWrap08 table{
  margin: 40px auto;
}
.contentsWrap08 td,
.contentsWrap08 th{
  border: 1px solid #333;
  vertical-align: middle;
  padding: 10px;
  width: 25%;
}
.contentsWrap08 td{
  text-align: center;
}

.contentsWrap08 td:last-child{
  background: #e3f4ff;
}
.contentsWrap08 tr:first-child{
  background: #e3f3ff;
}
.contentsWrap08 .tableSkyblue{
  background: #e3f3ff !important;
}
.contentsWrap08 th{
  background: #9bd6e1;
}
.contentsWrap08 .tableBlue{
  background: #0b39a1 !important;
  color: #fff;
}
.price{
  font-size: 5rem;
  background: linear-gradient(0deg, #830202 0%, #830202 50%, #d50707 50%, #d50707 100%);
  background-clip: border-box;
  color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
  font-weight: 700;
  font-family: "Bebas Neue", sans-serif;
}
.contentsWrap09{
  background: #c9defd;
  padding: 10px 0 30px;
}
.pointWrap09 {
  background: #245baf;
  color: #fff;
  padding: 10px;
  font-weight: 700;
  margin: 5px;
  position: relative;
}
.pointWrap09::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 20%;
  border-style: solid;
  border-width: 13px 10px 0 10px;
  border-color: #245baf transparent transparent;
  translate: -50% 100%;
}
.contentsTxt09 {
  background: #fff;
  padding: 10px;
  margin: 20px 5px;
  border-radius: 10px;
}
.contentsWrap10{
  background: #176184;
  margin: -40px 0 0;
}
.contentsBox10{
  display: flex;
  flex-wrap: wrap;
  text-align: center;
  justify-content: center;
}
.contentsItem10{
  color: #fff;
  width: calc(30% - 40px);
  margin: 20px;
  box-sizing: border-box;
}
.contentsWrap11{
  background: #1191DB;
  background: linear-gradient(90deg,rgba(17, 145, 219, 1) 0%, rgba(144, 36, 179, 1) 100%);
}
.contentsWrapInner11{
  padding: 20px;
  text-align: center;
  color: #fff;
}
.lawyer{
  font-size: 1.2rem;
}
/*フッター*/
footer{
  background: #dde9ea;
  font-size: 0.9rem;
}
footer ul{
  padding: 20px;
}
footer ul li{
  list-style: none;
  padding: 5px 0;
}
footer p{
  text-align: center;
  border-top: 1px solid #3457c1;
  width: 85%;
  margin: 0 auto;
  font-size: 0.9rem;
  padding: 20px;
}
/*固定ページ*/
.contentsWrap{
  padding: 40px 30px;
}
.siteTitle{
  padding: 20px;
  font-weight: 700;
}
.entryContent{
  padding: 20px;
}
.entry-title{
  border-bottom: 2px solid #1f447e;
}
/*ボタン*/

.headerBtn{
  background: #42c823;
  padding: 3px 10px;
  border-radius: 0 0 5px 5px;
  color: #fff;
  font-weight: 700;
}
.headerBtn p{
  padding: 0;
  text-align: center;
  font-size: 0.9rem;
}
.btnBox{
  font-weight: 400;
  font-size: 0.7rem;
  background: #fff;
  color: #42c823;
  display: inline-block;
  margin: 5px;
  padding: 0 5px;
  border-radius: 3px;
}
.btnBox02{
  font-weight: 400;
  font-size: 0.8rem;
  background: #fff;
  color: #42c823;
  display: block;
  padding: 0 10px;
  border-radius: 7px;
  width: 120px;
  position: absolute;
  bottom: 5px;
  right: 5px;
  line-height: 24px;
}
.btnWrap{
  margin: 40px auto;
  text-align: center;
}
.btn{
  position: relative;
  background: #42c823;
  padding: 20px 5px;
  width: 80%;
  display: inline-block;
  color: #fff;
  font-weight: 700;
  border-radius: 10px;
  height: 40px;
  line-height: 40px;
  font-size: 1rem;
  box-shadow: 0px 8px 0px 0px rgba(24, 103, 5, 1);
animation-name:btnani1;
animation-delay:0s;
animation-duration: 2s;
animation-timing-function: ease-in-out;
animation-iteration-count: infinite; 
}
.btn span{
  position: absolute;
  top:-20px;
  left: 10px;
  color: #198600;
  border-radius: 10px;
  border: 2px solid #42c823;
  padding: 5px 16px;
  font-size: 1rem;
  font-weight: 400;
  background: #fff;
  transform: rotate(-2deg);
  line-height: 24px;
}

.btnLine{
  display: flex;
  justify-content: center;
  align-items: center;
}
.btnLine::before,.btnLine::after {
    content: "";
    background-color: #176184;
    height: 2px;
    width: 25px;
}
.btnLine::before {
    margin-right: 30px;
    transform: rotate(60deg); 
}
.btnLine::after {
    margin-left: 30px;
    transform: rotate(-60deg); 
}
.btn02{
background: #176184;
  color: #fff;
  padding: 20px;
  border-radius: 45px;
  margin: 20px 0;
  display: block;
  width: 80%;
  margin: 10px auto;
  font-weight: 700;
}
.btnani {
  animation-name:btnani1;
  animation-delay:0s;
  animation-duration: 3s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite; 
}
@keyframes btnani1 {
0% {
  transform: translateY(0);
}
40% {
  transform: translateY(-10px);
}
60% {
  transform: translateY(-10px);
}
100% {
  transform: translateY(0);
}
}




/* パソコン */
@media (min-width: 960px){
.headerWrap {
  width: 960px;
  margin: 0 auto;
}
.headerWrap h1 {
  font-size: 2rem;
  padding: 0 30px;
}
.contentsWrap02 h2,
.contentsWrap03 h2,
.contentsWrap04 h2,
.contentsWrap05 h2,
.contentsWrap06 h2,
.contentsWrap07 h2{
  margin: 40px 10px;
  font-size: 1.2rem;
}

.contentsWrap10 h2{
  padding: 60px 0 0;
  font-size: 1.6rem;
}
.headerRibbon {
  align-items: center;
}
.headerRibbon img {
  width: 40px;
  height: 40px;
  margin: 0 10px;
}
.contentsWrapInner01,
.contentsWrapInner03,
.contentsWrapInner04,
.contentsWrapInner05,
.contentsWrapInner06,
.contentsWrapInner07,
.contentsWrapInner08,
.contentsWrapInner09,
.contentsWrapInner10,
.contentsWrap{
  width: 960px;
  margin: 0 auto;
}
.contentsWrapInner01 {
  width: 700px;
}
.contentsBox03 {
  margin: 20px 105px;
}
.itemBox03 {
  padding: 20px;
}
.contentsBox03_03 img{
  vertical-align: middle;
}
.contentsBox04 ul {
  margin: 30px;
  width: 60%;
  height: 420px;
  padding: 60px;
  box-sizing: border-box;
  font-size: 1.2rem;
}
.contentsBox04_02 p {
  font-size: 1.4rem;
}
.contentsItem05{
  display: flex;
  flex-wrap: wrap;
}
.contentsBox05 {
  margin: 30px 10px;
  width: calc(50% - 20px);
  box-sizing: border-box;
}
.contentsWrap06 img{
  width: 600px;
  display: block;
  margin: 0 auto;
}
.contentsBox03_02 {
  width: 80%;
  margin: 0 auto;
}
.contentsBox07 {
  margin: 20px 120px;
}
.contentsTxt09,
.pointWrap09{
  margin: 20px 120px;
}
.contentsWrap10 {
  margin: -60px 0 0;
}
.footerContents{
  width: 960px;
  margin: 0 auto;
  display: flex;
}
footer ul {
  margin: 30px;
}

.btnBox {

  font-size: 0.8rem;

}
.btn {
  font-size: 1.2rem;
  width: 70%;
}
.btn02 {

  width: 50%;
}
}
/* スマホ */
@media (max-width: 959px) {

.contentsWrap08 table {
  margin: 40px 10px;
font-size: 0.7rem;
}
.boxImage05 {
  font-size: 0.7rem;
}
}
/*
Font Awesome Free License

Font Awesome Free is free, open source, and GPL friendly. You can use it for
commercial projects, open source projects, or really almost whatever you want.
Full Font Awesome Free license: https://fontawesome.com/license/free.

--------------------------------------------------------------------------------

# Icons: CC BY 4.0 License (https://creativecommons.org/licenses/by/4.0/)

The Font Awesome Free download is licensed under a Creative Commons
Attribution 4.0 International License and applies to all icons packaged
as SVG and JS file types.
*/
@font-face {
  font-family: 'icomoon';
  src:  url('fonts/icomoon.eot?nbm79u');
  src:  url('fonts/icomoon.eot?nbm79u#iefix') format('embedded-opentype'),
    url('fonts/icomoon.ttf?nbm79u') format('truetype'),
    url('fonts/icomoon.woff?nbm79u') format('woff'),
    url('fonts/icomoon.svg?nbm79u#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

i {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.i-scale-balanced-solid:before {
  content: "\e90f";
}
.i-lightbulb-regular:before {
  content: "\e900";
}
.i-arrow-down-solid:before {
  content: "\e902";
}
.i-award-solid:before {
  content: "\e903";
}
.i-bullhorn-solid:before {
  content: "\e904";
}
.i-chart-column-solid:before {
  content: "\e906";
}
.i-circle-check-solid:before {
  content: "\e907";
}
.i-comment-dots:before {
  content: "\e908";
}
.i-exclamation-circle:before {
  content: "\e909";
}
.i-hand-point-right-regular:before {
  content: "\e90c";
}
.i-hand-point-up-regular:before {
  content: "\e90d";
}
.i-heart-circle-check-solid:before {
  content: "\e90e";
}
.i-person-running:before {
  content: "\e901";
}
.i-square-check:before {
  content: "\e905";
}
.i-comment-dots1:before {
  content: "\e90a";
}
.i-arrows-alt-h:before {
  content: "\e90b";
}