/*
! tailwindcss v3.0.15 | MIT License | https://tailwindcss.com
*//*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: currentColor; /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
*/

html {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-tab-size: 4; /* 3 */
  -o-tab-size: 4;
     tab-size: 4; /* 3 */
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0; /* 1 */
  line-height: inherit; /* 2 */
 }

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

/*
Remove the default font size and weight for headings.
*/


h2,
h3,
h4 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/


strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font family by default.
2. Correct the odd `em` font sizing in all browsers.
*/

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
[type='button'],
[type='submit'] {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

/*
Removes the default spacing and border for appropriate elements.
*/


dl,
h2,
h3,
h4,
p {
  margin: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

input:-ms-input-placeholder, textarea:-ms-input-placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

/*
Set the default cursor for buttons.
*/

button {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
iframe {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img {
  max-width: 100%;
  height: auto;
}

/*
Ensure the default browser behavior of the `hidden` attribute.
*/

*, ::before, ::after {
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
}
.pointer-events-none {
  pointer-events: none;
}
.fixed {
  position: fixed;

}
.absolute {
  position: absolute;
}
.relative {
  position: relative;
}
.-bottom-o-64 {
  bottom: -0.64rem;
}
.left-0 {
  left: 0px;
}
.-top-o-64 {
  top: -0.64rem;
}
.-top-o-30 {
  top: -0.30rem;
}
.right-0 {
  right: 0px;
}
.bottom-0 {
  bottom: 0px;
}
.z-40 {
  z-index: 40;
}
.z-50 {
  z-index: 50;
}
.mx-auto {
  margin-left: auto;
  margin-right: auto;
}
.my-o-20 {
  margin-top: 0.20rem;
  margin-bottom: 0.20rem;
}
.my-o-16 {
  margin-top: 0.16rem;
  margin-bottom: 0.16rem;
}
.-mt-o-48 {
  margin-top: -0.48rem;
}
.mt-o-32 {
  margin-top: 0.32rem;
}
.mt-o-16 {
  margin-top: 0.16rem;
}
.mt-o-88 {
  margin-top: 0.88rem;
}
.mt-o-40 {
  margin-top: 0.40rem;
}
.mt-o-64 {
  margin-top: 0.64rem;
}
.mt-o-24 {
  margin-top: 0.24rem;
}
.ml-auto {
  margin-left: auto;
}
.-mt-o-32 {
  margin-top: -0.32rem;
}
.mt-o-48 {
  margin-top: 0.48rem;
}
.mt-o-8 {
  margin-top: 0.08rem;
}
.mt-o-20 {
  margin-top: 0.20rem;
}
.mt-o-56 {
  margin-top: 0.56rem;
}
.mt-o-360 {
  margin-top: 3.60rem;
}
.mt-o-28 {
  margin-top: 0.28rem;
}
.mt-o-132 {
  margin-top: 1.32rem;
}
.ml-o-88 {
  margin-left: 0.88rem;
}
.mr-auto {
  margin-right: auto;
}
.mt-o-12 {
  margin-top: 0.12rem;
}
.mb-o-40 {
  margin-bottom: 0.40rem;
}
.ml-o-48 {
  margin-left: 0.48rem;
}
.mt-o-80 {
  margin-top: 0.80rem;
}
.mb-o-8 {
  margin-bottom: 0.08rem;
}
.block {
  display: block;
}
.inline-block {
  display: inline-block;
}
.flex {
  display: flex;
}
.h-o-30 {
  height: 0.30rem;
}
.h-o-1 {
  height: 0.01rem;
}
.h-o-240 {
  height: 2.40rem;
}
.h-o-100 {
  height: 1rem;
}
.w-o-692 {
  width: 6.92rem;
}
.w-o-264 {
  width: 2.64rem;
}
.w-o-280 {
  width: 2.80rem;
}
.w-full {
  width: 100%;
}
.w-o-664 {
  width: 6.64rem;
}
.w-o-532 {
  width: 5.32rem;
}
.w-o-624 {
  width: 6.24rem;
}
.w-o-620 {
  width: 6.20rem;
}
.w-o-720 {
  width: 7.20rem;
}
.w-o-580 {
  width: 5.80rem;
}
.w-o-380 {
  width: 3.80rem;
}
.w-o-640 {
  width: 6.40rem;
}
.w-o-440 {
  width: 4.40rem;
}
.w-o-540 {
  width: 5.40rem;
}
.w-o-628 {
  width: 6.28rem;
}
.w-o-140 {
  width: 1.40rem;
}
.w-o-258 {
  width: 2.58rem;
}
.w-o-478 {
  width: 4.78rem;
}
.w-o-344 {
  width: 3.44rem;
}
.w-o-30 {
  width: 0.30rem;
}
.w-o-500 {
  width: 5rem;
}
.w-o-220 {
  width: 2.20rem;
}
.w-o-160 {
  width: 1.60rem;
}
.w-o-48 {
  width: 0.48rem;
}
.w-o-622 {
  width: 6.22rem;
}
.w-o-300 {
  width: 3rem;
}
.w-o-740 {
  width: 7.40rem;
}
.w-o-357 {
  width: 3.57rem;
}
.w-o-112 {
  width: 1.12rem;
}
.w-o-315 {
  width: 3.15rem;
}
.w-o-120 {
  width: 1.20rem;
}
.w-o-708 {
  width: 7.08rem;
}
.w-o-614 {
  width: 6.14rem;
}
.rotate-90 {
  --tw-rotate: 90deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.cursor-pointer {
  cursor: pointer;
}
.resize-none {
  resize: none;
}
.appearance-none {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.items-start {
  align-items: flex-start;
}
.items-center {
  align-items: center;
}
.justify-between {
  justify-content: space-between;
}
.gap-o-8 {
  gap: 0.08rem;
}
.overflow-scroll {
  overflow: scroll;
}
.whitespace-nowrap {
  white-space: nowrap;
}
.rounded-full {
  border-radius: 9999px;
}
.border {
  border-width: 1px;
}
.border-2 {
  border-width: 2px;
}
.border-t {
  border-top-width: 1px;
}
.border-dotted {
  border-style: dotted;
}
.border-input {
  --tw-border-opacity: 1;
  border-color: rgb(220 220 220 / var(--tw-border-opacity));
}
.border-placeholder {
  --tw-border-opacity: 1;
  border-color: rgb(156 163 175 / var(--tw-border-opacity));
}
.border-navy {
  --tw-border-opacity: 1;
  border-color: rgb(15 41 66 / var(--tw-border-opacity));
}
.bg-navy {
  --tw-bg-opacity: 1;
  background-color: rgb(15 41 66 / var(--tw-bg-opacity));
}
.bg-blue {
  --tw-bg-opacity: 1;
  background-color: rgb(36 60 84 / var(--tw-bg-opacity));
}
.bg-whiteBlue {
  --tw-bg-opacity: 1;
  background-color: rgb(236 243 251 / var(--tw-bg-opacity));
}
.bg-whiteGray {
  --tw-bg-opacity: 1;
  background-color: rgb(228 234 236 / var(--tw-bg-opacity));
}
.bg-o-white {
  background-color: rgba(255,255,255,0.7);
}
.bg-gray {
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 250 / var(--tw-bg-opacity));
}
.bg-black {
  --tw-bg-opacity: 1;
  background-color: rgb(36 36 36 / var(--tw-bg-opacity));
}
.bg-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}
.bg-beige {
  --tw-bg-opacity: 1;
  background-color: rgb(193 178 163 / var(--tw-bg-opacity));
}
.bg-lightBule {
  --tw-bg-opacity: 1;
  background-color: rgb(220 233 245 / var(--tw-bg-opacity));
}
.bg-red {
  --tw-bg-opacity: 1;
  background-color: rgb(205 10 27 / var(--tw-bg-opacity));
}
.bg-catch {
  background-image: url(../images/catch_bg.png);
}
.object-contain {
  -o-object-fit: contain;
     object-fit: contain;
}
.py-o-24 {
  padding-top: 0.24rem;
  padding-bottom: 0.24rem;
}
.py-o-12 {
  padding-top: 0.12rem;
  padding-bottom: 0.12rem;
}
.py-o-72 {
  padding-top: 0.72rem;
  padding-bottom: 0.72rem;
}
.py-o-80 {
  padding-top: 0.80rem;
  padding-bottom: 0.80rem;
}
.py-o-20 {
  padding-top: 0.20rem;
  padding-bottom: 0.20rem;
}
.py-o-40 {
  padding-top: 0.40rem;
  padding-bottom: 0.40rem;
}
.py-o-64 {
  padding-top: 0.64rem;
  padding-bottom: 0.64rem;
}
.py-o-8 {
  padding-top: 0.08rem;
  padding-bottom: 0.08rem;
}
.py-o-16 {
  padding-top: 0.16rem;
  padding-bottom: 0.16rem;
}
.px-o-24 {
  padding-left: 0.24rem;
  padding-right: 0.24rem;
}
.px-o-32 {
  padding-left: 0.32rem;
  padding-right: 0.32rem;
}
.py-o-28 {
  padding-top: 0.28rem;
  padding-bottom: 0.28rem;
}
.py-o-36 {
  padding-top: 0.36rem;
  padding-bottom: 0.36rem;
}
.pt-o-16 {
  padding-top: 0.16rem;
}
.pr-o-8 {
  padding-right: 0.08rem;
}
.pb-o-20 {
  padding-bottom: 0.20rem;
}
.pb-o-40 {
  padding-bottom: 0.40rem;
}
.pt-o-28 {
  padding-top: 0.28rem;
}
.pb-o-56 {
  padding-bottom: 0.56rem;
}
.pb-o-80 {
  padding-bottom: 0.80rem;
}
.pl-o-80 {
  padding-left: 0.80rem;
}
.pr-o-32 {
  padding-right: 0.32rem;
}
.pt-o-280 {
  padding-top: 2.80rem;
}
.pb-o-228 {
  padding-bottom: 2.28rem;
}
.pt-o-108 {
  padding-top: 1.08rem;
}
.pb-o-16 {
  padding-bottom: 0.16rem;
}
.pt-o-64 {
  padding-top: 0.64rem;
}
.pb-o-88 {
  padding-bottom: 0.88rem;
}
.pt-o-24 {
  padding-top: 0.24rem;
}
.pt-o-52 {
  padding-top: 0.52rem;
}
.pb-o-20 {
  padding-bottom: 0.20rem;
}
.pb-o-92 {
  padding-bottom: 0.92rem;
}
.pt-o-104 {
  padding-top: 1.04rem;
}
.pt-o-40 {
  padding-top: 0.40rem;
}
.text-center {
  text-align: center;
}
.text-md {
  font-size: 13.02083vw;
}
.text-16 {
  font-size: 0.16rem;
}
.text-19 {
  font-size: 0.19rem;
}
.text-20 {
  font-size: 0.20rem;
}
.text-26 {
  font-size: 0.26rem;
}
.text-23 {
  font-size: 0.23rem;
}
.text-30 {
  font-size: 0.30rem;
}
.text-28 {
  font-size: 0.28rem;
}
.text-68 {
  font-size: 0.68rem;
}
.text-31 {
  font-size: 0.31rem;
}
.text-52 {
  font-size: 0.52rem;
}

.text-25 {
  font-size: 0.25rem;
}
.text-67 {
  font-size: 0.67rem;
}
.text-63 {
  font-size: 0.63rem;
}
.text-33 {
  font-size: 0.33rem;
}
.text-22 {
  font-size: 0.22rem;
}
.text-35 {
  font-size: 0.35rem;
}
.text-24 {
  font-size: 0.24rem;
}
.text-32 {
  font-size: 0.32rem;
}
.text-37 {
  font-size: 0.37rem;
}
.text-21 {
  font-size: 0.21rem;
}
.font-bold {
  font-weight: 700;
}
.font-medium {
  font-weight: 500;
}
.leading-o-18 {
  line-height: 1.8;
}
.leading-o-20 {
  line-height: 2;
}
.leading-o-14 {
  line-height: 1.4;
}
.leading-o-16 {
  line-height: 1.6;
}
.leading-none {
  line-height: 1;
}
.tracking-o-75 {
  letter-spacing: 0.075em;
}
.tracking-o-125 {
  letter-spacing: 0.125em;
}
.tracking-o-25 {
  letter-spacing: 0.025em;
}
.tracking-o-50 {
  letter-spacing: 0.05em;
}
.tracking-o-100 {
  letter-spacing: 0.100em;
}
.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}
.text-navy {
  --tw-text-opacity: 1;
  color: rgb(15 41 66 / var(--tw-text-opacity));
}
.text-red {
  --tw-text-opacity: 1;
  color: rgb(205 10 27 / var(--tw-text-opacity));
}
.text-beige {
  --tw-text-opacity: 1;
  color: rgb(193 178 163 / var(--tw-text-opacity));
}
.text-darkRed {
  --tw-text-opacity: 1;
  color: rgb(178 15 57 / var(--tw-text-opacity));
}
.text-placeholder {
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity));
}
.text-blue {
  --tw-text-opacity: 1;
  color: rgb(36 60 84 / var(--tw-text-opacity));
}
.opacity-0 {
  opacity: 0;
}
.duration-200 {
  transition-duration: 200ms;
}

input::-moz-placeholder{
  color: #9ca3af;
}

input:-ms-input-placeholder{
  color: #9ca3af;
}

input::placeholder{
  color: #9ca3af;
}

textarea::-moz-placeholder {
  color: #9ca3af;
}

textarea:-ms-input-placeholder {
  color: #9ca3af;
}

textarea::placeholder {
  color: #9ca3af;
}

html{
  /* ベースフォント */
  font-family: 'Noto Sans JP', sans-serif;
  color: #242424;
  scroll-behavior: smooth;
}

.cta_arrow{
  position: relative;
}

.cta_arrow::before{
  position: absolute;
  content: "";
  background: url(../images/cta_arrow.png) no-repeat left center/contain;
  width: 0.2rem;
  height: 0.2rem;
  left: -0.32rem;
  top: calc(50% - 0.1rem );
}

.cta_arrow::after{
  position: absolute;
  content: "";
  background: url(../images/cta_arrow.png) no-repeat right center/contain;
  width: 0.2rem;
  height: 0.2rem;
  right: -0.32rem;
  top: calc(50% - 0.1rem );
}

.cta_arrow2{
  position: relative;
}

.cta_arrow2::before{
  position: absolute;
  content: "";
  background: url(../images/cta_arrow2.png) no-repeat left center/contain;
  width: 0.2rem;
  height: 0.2rem;
  left: -0.32rem;
  top: calc(50% - 0.1rem );
}

.cta_arrow2::after{
  position: absolute;
  content: "";
  background: url(../images/cta_arrow2.png) no-repeat right center/contain;
  width: 0.2rem;
  height: 0.2rem;
  right: -0.32rem;
  top: calc(50% - 0.1rem );
}

.cta_btn_bg{
  position: relative;
}
.cta_btn_bg::before{
  content: "";
  position: absolute;
  height: 1.2rem;
  width: 100%;
  background: url(../images/cta_btn01_bg.png) no-repeat top center/6rem;
  left: 0;
  top: 0;
}


.small.cta_btn_bg::before{
  content: "";
  position: absolute;
  height: 1.2rem;
  width: 100%;
  background: url(../images/cta_btn02_bg.png) no-repeat top center/5.2rem;
  left: 0;
  top: 0;
}

.cta_line{
  position: relative;
  width: 6rem;
  margin: 0 auto;
}

h2.cta_line::after{
  content: "無料体験レッスンも可";
  position: absolute;
  background:#ffff00;
  color: #0f2942;
  font-weight: bold;
  width: 40%;
  height: 20px;
  padding: 0px 0px;
  top: -7px;
  left: 0px; 
  /*z-index: 50;*/
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  font-feature-settings : "palt";
  font-size: 130%!important;
  /*border-radius: 30px;*/
}
/*  
.cta_line::before{
  content: "";
  position: absolute;
  background-color: white;
  width: .5rem;
  height: .02rem;
  top: 0;
  top: 50%;
  left: 0;
  z-index: 50;
}
*/
.small.cta_line{
  position: relative;
  width: 5.2rem;
  margin: 0 auto;
}
/*
.small.cta_line::before{
  content: "";
  position: absolute;
  background-color: white;
  width: .5rem;
  height: .02rem;
  top: 0;
  top: 50%;
  left: 0;
  z-index: 50;
}
*/
.cta_shadow{
  position: relative;
}

.cta_shadow::after{
  content: "";
  position: absolute;
  width: 4.48rem;
  height: 1rem;
  box-shadow: 0 0.2rem 0.2rem 0 rgb(0 0 0 / 12%);
  top: 0rem;
  left: 0.24rem;
  z-index: -1;
}

.reason02_bg01{
  background: url(../images/reason02_bg01.png) no-repeat top center/cover;
}

.reason02_head01{
  background: url(../images/reason02_head01.png) no-repeat top center/contain;
}

.reason02_head02{
  background: url(../images/reason02_head02.png) no-repeat top left/2.4rem,url(../images/reason02_bg02.png) no-repeat bottom right/2.8rem;
}

.reason02_head03{
  background: url(../images/reason02_head03.png) no-repeat top left/2.4rem;
}

.cta_bg{
  background: url(../images/cta_bg.png) no-repeat center center/cover;
}

.dot{
  position: relative;
}

.dot::before{
  position: absolute;
  content: "";
  width: 0.08rem;
  height: 0.08rem;
  border-radius: 0.4rem;
  background-color: #c1b2a3;
  left: calc(50% - 0.04rem);
  transform: translate(-50%, -0.08rem);
}

.cta_footer_bg{
  background: url(../images/cta_footer_bg.png) no-repeat center top/cover;
}

.task_box_bg{
  background: url(../images/task_box_bg.png) no-repeat center top/cover;
}

.task_box_bg02{
  background: #eeeeee;}

.voice_bg{
  background: url(../images/voice_bg.png) no-repeat center top/cover;
}
.task_boxshadow{
  box-shadow: 0 0.24rem 0.12rem rgba(0, 0, 0,0.08);
}

.task_boxshadow02{
  box-shadow: 0 0.12rem 0.12rem rgba(0, 0, 0,0.08);
  border: 1px #eeeeee solid;
}


.voice_shadow{
  box-shadow: 0 0.24rem 0.12rem rgba(0, 0, 0,0.08);
}

.plan_shadow{
  box-shadow: 0 0.12rem 0.2rem rgba(0, 0, 0,0.08);
}

.form_arrow01{
  position: relative;
}

.form_arrow01::after{
  position: absolute;
  content: "";
  border-top: solid 0.12rem #c1b2a3;
  border-right: solid 0.12rem transparent;
  border-left: solid 0.12rem transparent;
  bottom: -0.10rem;
  left: calc(50% - 0.06rem);
}

.form_arrow02{
  position: relative;
}

.form_arrow02::after{
  position: absolute;
  content: "";
  border-top: solid 0.14rem #0f2942;
  border-right: solid 0.14rem transparent;
  border-left: solid 0.14rem transparent;
  bottom: -0.13rem;
  left: calc(50% - 0.06rem);
}




.cta_btn_bg_footer{
  position: relative;
}
.cta_btn_bg_footer::before{
  content: "";
  position: absolute;
  height: 0.65rem;
  width: 100%;
  background: url(../images/footer_btn_bg.png) no-repeat top center/3.57rem;
  left: 0;
  top: 0;
}

.cta_footer_line_center{
  left: calc(50% - 0.56rem);
  top: 50%;
}

.selectbox_check{
  position: relative;
}

.selectbox_check::after{
  position: absolute;
  content: "▼";
  font-size: 0.2rem;
  right: 0.16rem;
  top: 0.2rem;
  z-index: 1;
}

  .footer.cta_btn_arrow{
    position: relative;
  }

  .footer.cta_btn_arrow::after{
    content: "";
    position: absolute;
    background: url(../images/header_btn_arrow.png) no-repeat center right/contain;
    width: 0.16rem;
    height: 0.14rem;
    right: 0.1rem;
    top: 55%;
  }

  .gray_bg01{
    position: absolute;
    background: #f6f6f6;
    width: 0.4rem;
    height: 2.1rem;
    right: 0.2rem;
  }
  .gray_bg02{
    position: absolute;
    background: #f6f6f6;
    width: 0.8rem;
    height: 2.2rem;
    transform: rotate(-58deg);
    left: 3rem;
    top: 4rem;
  }

.js-errow.test{
  border-color: #3cb371;
}
/* .textCheck:valid{
  border: solid 0.01rem #3cb371;  
} */

/* 光らせるためのstyle */
/* .shine{
  border: 2px solid transparent;
  position: relative;
  overflow: hidden;
  height: 1.3rem;
} */
/* .small.shine{
  height: 1.2rem;
} */
/* 光の疑似要素 */
/* .shine::after{
  content: "";
  animation: shine 3s cubic-bezier(0.25, 0, 0.25, 1) infinite;
  background-color: #fff;
  width: 140%;
  height: 100%;
  transform: skewX(-45deg);
  top: 0;
  left: -160%;
  opacity: 0.5;
  position: absolute;
} */
/* 光の動き */
/* @keyframes shine{
  0% {
    left: -160%;
    opacity: 0;
  }
  70% {
    left: -160%;
    opacity: 0.5;
  }
  71% {
    left: -160%;
    opacity: 1;
  }
  100% {
    left: -20%;
    opacity: 0;
  }
}
  */
@media screen and (min-width:768px){
  .reason02_bg01{
    background: url(../images/reason02_bg01_pc.png) no-repeat top center/cover;
  }

  .reason02_head01{
    background: url(../images/reason02_head01_pc.png) no-repeat right top/10.4rem;
  }

  .reason02_head02{
    background: url(../images/reason02_head02_pc.png) no-repeat top left 2.56rem/2rem,url(../images/reason02_bg02.png) no-repeat bottom right 1.8rem/1.6rem;
  }

  .reason02_head03{
    background: url(../images/reason02_head03_pc.png) no-repeat top left 2.56rem/2rem;
  }
  .cta_btn_bg{
    position: relative;
  }
  .cta_line{
    position: relative;
    width: 5rem;
  }
  
    h2.cta_line::after{
  content: "無料体験レッスンも可";
  position: absolute;
  background:#ffff00;
  color: #0f2942;
  font-weight: bold;
  width: 40%;
  height: 25px;
  padding: 0px;
  top: -12px;
  left: 0px;
   /*z-index: 50;*/
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  font-feature-settings : "palt";
  font-size: 120%!important;
}
/*  
  .cta_line::before{
    content: "";
    position: absolute;
    background-color: white;
    width: .5rem;
    height: .02rem;
    top: 54%;
    left: 0;
    z-index: 50;
  }
*/
  .cta_btn_bg::before{
    height: 0.90rem;
    background: url(../images/cta_btn01_bg_pc.png) no-repeat top center/5rem;
  }
  .cta_btn_bg::after{
    content: "";
    transition: all .4s;
    position: absolute;
    opacity: 0;
    height: 0.90rem;
    width: 100%;
    background: url(../images/cta_btn01_bg_hover.png) no-repeat top center/5rem;
    left: 0;
    top: 0;
  }
  .small.cta_btn_bg{
    position: relative;
  }
  .small.cta_line{
    position: relative;
    width: 5rem;
  }
/*  
  .small.cta_line::before{
    content: "";
    position: absolute;
    background-color: white;
    width: .5rem;
    height: .02rem;
    top: 50%;
    left: 0;
    z-index: 50;
  }
 */
  .small.cta_btn_bg::before{
    height: 0.90rem;
    background: url(../images/cta_btn01_bg_pc.png) no-repeat top center/5rem;
  }
  .small.cta_btn_bg::after{
    content: "";
    transition: all .4s;
    position: absolute;
    opacity: 0;
    height: 0.90rem;
    width: 100%;
    background: url(../images/cta_btn01_bg_hover.png) no-repeat top center/5rem;
    left: 0;
    top: 0;
  }
  .cta_btn_bg:hover::after{
    opacity: 1;
    }
  .cta_bg{
    background: url(../images/cta_bg_pc.png) no-repeat center center/cover;
  }
  .cta_footer_bg{
  background: url(../images/cta_footer_bg_pc.png) no-repeat center top/cover;
  }
  .voice_bg{
    background: url(../images/voice_bg_pc.png) no-repeat center top/cover;
  }
  .cta_btn_bg_footer::before{
    background: url(../images/footer_btn_bg_pc.png) no-repeat top center/3.57rem;
    height: 0.7rem;
    left: 0;
    top: -0.08rem;
  }
  .cta_btn_bg_footer::after{
    transition: all .4s;
    content: "";
    position: absolute;
    height: 0.7rem;
    width: 100%;
    background: url(../images/footer_btn_bg_hover.png) no-repeat top center/3.57rem;
    left: 0;
    top: -0.08rem;
    opacity: 0;
  }
  .cta_btn_bg_footer:hover::after{
    opacity: 1;
  }
  .cta_footer_line_center{
  left: calc(50% - 0.24rem);
  top: 72%;
  }

  .cta_btn_bg_header{
    position: relative;
  }
  .cta_btn_bg_header::before{
    content: "";
    position: absolute;
    height: 0.5rem;
    width: 100%;
    background: url(../images/header_btn_pc.png) no-repeat top center/3.57rem;
    left: 0;
    top: 0;
  }
  .cta_btn_bg_header::after{
    transition: all .4s;
    content: "";
    position: absolute;
    height: 0.5rem;
    width: 100%;
    background: url(../images/header_btn_hover_pc.png) no-repeat top center/3.57rem;
    left: 0;
    top: 0rem;
    opacity: 0;
  }
  .cta_btn_bg_header:hover::after{
    opacity: 1;
  }

  .cta_btn_arrow{
    position: relative;
  }

  .cta_btn_arrow::after{
    content: "";
    position: absolute;
    background: url(../images/header_btn_arrow.png) no-repeat center right/contain;
    width: 0.16rem;
    height: 0.14rem;
    right: 0.12rem;
    top: 50%;
  }
  .footer.cta_btn_arrow{
    position: relative;
  }

  .footer.cta_btn_arrow::after{
    content: "";
    position: absolute;
    background: url(../images/header_btn_arrow.png) no-repeat center right/contain;
    width: 0.16rem;
    height: 0.14rem;
    right: 0.1rem;
    top: 60%;
  }
  .cta_shadow::after{
  content: "";
  position: absolute;
  width: 4.48rem;
  height: 0.72rem;
  box-shadow: 0 0.2rem 0.2rem 0 rgb(0 0 0 / 12%);
  top: 0.06rem;
  left: 0.24rem;
  z-index: -1;
  }
  .selectbox_check::after{
    position: absolute;
    content: "▼";
    font-size: 0.16rem;
    right: 0.12rem;
    top: 0.1rem;
    z-index: 1;
  }
    .gray_bg01{
      display: none;
  }
  .gray_bg02{
    display: none;
  }
}
@media (min-width: 768px) {

  .md\:fixed {
    position: fixed;

  }

  .md\:absolute {
    position: absolute;
  }

  .md\:-bottom-o-48 {
    bottom: -0.48rem;
  }
  
    .md\:-top-o-100 {
    top: -1.00rem;
  }
  
      .md\:-top-o-80 {
    top: -0.80rem;
  }

  .md\:-top-o-40 {
    top: -0.40rem;
  }

  .md\:right-o-24 {
    right: 0.24rem;
  }

  .md\:right-0 {
    right: 0px;
  }

  .md\:left-o-20 {
    left: 0.20rem;
  }

  .md\:z-50 {
    z-index: 50;
  }

  .md\:mx-auto {
    margin-left: auto;
    margin-right: auto;
  }

  .md\:mx-0 {
    margin-left: 0px;
    margin-right: 0px;
  }

  .md\:mt-0 {
    margin-top: 0px;
  }

  .md\:mt-o-64 {
    margin-top: 0.64rem;
  }

  .md\:mt-o-40 {
    margin-top: 0.40rem;
  }

  .md\:mt-o-80 {
    margin-top: 0.80rem;
  }

  .md\:-mt-o-24 {
    margin-top: -0.24rem;
  }

  .md\:-mt-o-8 {
    margin-top: -0.08rem;
  }

  .md\:mt-o-8 {
    margin-top: 0.08rem;
  }

  .md\:mt-o-32 {
    margin-top: 0.32rem;
  }

  .md\:mt-o-48 {
    margin-top: 0.48rem;
  }

  .md\:mr-o-24 {
    margin-right: 0.24rem;
  }

  .md\:block {
    display: block;
  }

  .md\:inline-block {
    display: inline-block;
  }

  .md\:inline {
    display: inline;
  }

  .md\:flex {
    display: flex;
  }

  .md\:hidden {
    display: none;
  }

  .md\:h-o-180 {
    height: 1.80rem;
  }

  .md\:h-o-72 {
    height: 0.72rem;
  }

  .md\:h-o-2 {
    height: 0.02rem;
  }

  .md\:w-full {
    width: 100%;
  }

  .md\:w-o-1500 {
    width: 15.00rem;
  }

  .md\:w-o-640 {
    width: 6.40rem;
  }

  .md\:w-o-692 {
    width: 6.92rem;
  }

  .md\:w-o-357 {
    width: 3.57rem;
  }

  .md\:w-o-1380 {
    width: 13.80rem;
  }

  .md\:w-o-772 {
    width: 7.72rem;
  }

  .md\:w-o-520 {
    width: 5.20rem;
  }

  .md\:w-o-400 {
    width: 4rem;
  }

  .md\:w-o-1000 {
    width: 10rem;
  }

  .md\:w-o-460 {
    width: 4.60rem;
  }

  .md\:w-o-500 {
    width: 5rem;
  }

  .md\:w-o-540 {
    width: 5.40rem;
  }

  .md\:w-o-1100 {
    width: 11rem;
  }

  .md\:w-o-800 {
    width: 8rem;
  }

  .md\:w-o-448 {
    width: 4.48rem;
  }

  .md\:w-o-952 {
    width: 9.52rem;
  }

  .md\:w-o-352 {
    width: 3.52rem;
  }

  .md\:w-o-432 {
    width: 4.32rem;
  }

  .md\:w-o-470 {
    width: 4.70rem;
  }

  .md\:w-o-940 {
    width: 9.40rem;
  }

  .md\:w-o-496 {
    width: 4.96rem;
  }

  .md\:w-o-120 {
    width: 1.20rem;
  }

  .md\:w-o-888 {
    width: 8.88rem;
  }

  .md\:w-o-994 {
    width: 9.94rem;
  }

  .md\:w-o-240 {
    width: 2.40rem;
  }

  .md\:w-o-780 {
    width: 7.80rem;
  }

  .md\:w-o-680 {
    width: 6.80rem;
  }

  .md\:w-o-478 {
    width: 4.78rem;
  }

  .md\:w-o-364 {
    width: 3.64rem;
  }

  .md\:w-o-160 {
    width: 1.60rem;
  }

  .md\:w-o-420 {
    width: 4.20rem;
  }

  .md\:w-o-550 {
    width: 5.50rem;
  }

  .md\:w-o-720 {
    width: 7.20rem;
  }

  .md\:w-o-264 {
    width: 2.64rem;
  }

  .md\:w-o-620 {
    width: 6.20rem;
  }

  .md\:w-o-1480 {
    width: 14.80rem;
  }

  .md\:w-o-714 {
    width: 7.14rem;
  }

  .md\:w-o-280 {
    width: 2.80rem;
  }

  .md\:w-o-48 {
    width: 0.48rem;
  }

  .md\:w-o-1036 {
    width: 10.36rem;
  }

  .md\:flex-wrap {
    flex-wrap: wrap;
  }

  .md\:items-start {
    align-items: flex-start;
  }

  .md\:items-end {
    align-items: flex-end;
  }

  .md\:items-center {
    align-items: center;
  }

  .md\:justify-start {
    justify-content: flex-start;
  }

  .md\:justify-center {
    justify-content: center;
  }

  .md\:justify-between {
    justify-content: space-between;
  }

  .md\:gap-o-28 {
    gap: 0.28rem;
  }

  .md\:gap-o-80 {
    gap: 0.80rem;
  }

  .md\:gap-o-100 {
    gap: 1rem;
  }

  .md\:gap-o-20 {
    gap: 0.20rem;
  }

  .md\:gap-o-16 {
    gap: 0.16rem;
  }

  .md\:bg-white {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity));
  }

  .md\:bg-catch_pc {
    background-image: url(../images/catch_bg_pc.png);
  }

  .md\:px-o-32 {
    padding-left: 0.32rem;
    padding-right: 0.32rem;
  }

  .md\:py-o-64 {
    padding-top: 0.64rem;
    padding-bottom: 0.64rem;
  }

  .md\:py-o-12 {
    padding-top: 0.12rem;
    padding-bottom: 0.12rem;
  }

  .md\:pt-o-10 {
    padding-top: 0.10rem;
  }

  .md\:pb-0 {
    padding-bottom: 0px;
  }

  .md\:pt-o-64 {
    padding-top: 0.64rem;
  }

  .md\:pt-o-20 {
    padding-top: 0.20rem;
  }

  .md\:pt-o-140 {
    padding-top: 1.40rem;
  }

  .md\:pb-o-180 {
    padding-bottom: 1.80rem;
  }

  .md\:pt-0 {
    padding-top: 0px;
  }

  .md\:pt-o-18 {
    padding-top: 0.18rem;
  }

  .md\:pb-o-56 {
    padding-bottom: 0.56rem;
  }

  .md\:pt-o-80 {
    padding-top: 0.80rem;
  }

  .md\:pt-o-72 {
    padding-top: 0.72rem;
  }

  .md\:pt-o-12 {
    padding-top: 0.12rem;
  }

  .md\:pb-o-28 {
    padding-bottom: 0.28rem;
  }

  .md\:pr-o-8 {
    padding-right: 0.08rem;
  }

  .md\:text-left {
    text-align: left;
  }

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

  .md\:text-pc {
    font-size: 6.51042vw;
  }

  .md\:text-16 {
    font-size: 0.16rem;
  }

  .md\:text-19 {
    font-size: 0.19rem;
  }

  .md\:text-22 {
    font-size: 0.22rem;
  }

  .md\:text-50 {
    font-size: 0.50rem;
  }

  .md\:text-25 {
    font-size: 0.25rem;
  }

  .md\:text-45 {
    font-size: 0.45rem;
  }

  .md\:text-30 {
    font-size: 0.30rem;
  }

  .md\:text-24 {
    font-size: 0.24rem;
  }

  .md\:text-18 {
    font-size: 0.18rem;
  }

  .md\:text-14 {
    font-size: 0.14rem;
  }

  .md\:text-23 {
    font-size: 0.23rem;
  }

  .md\:shadow-lg {
    --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }
}
@media (max-width: 767px) {

  .sp\:-mt-o-24 {
    margin-top: -0.24rem;
  }

  .sp\:mr-o-88 {
    margin-right: 0.88rem;
  }

  .sp\:block {
    display: block;
  }

  .sp\:hidden {
    display: none;
  }

  .sp\:whitespace-nowrap {
    white-space: nowrap;
  }
}



/*2022.07.11-------------------------------------*/

/*非表示設定------*/
@media (min-width: 1200px) {.hidden-lg {display: none !important;}}
@media (min-width: 992px) and (max-width: 1199px) {.hidden-md {display: none !important;}}
@media (min-width: 768px) and (max-width: 991px) {.hidden-sm {display: none !important;}}
@media (max-width: 767px) {.hidden-xs {display: none !important;}}




/*吹き出し*/
.tab_box01{
  background: #243c54;
  padding: 0 0.15rem;
  display: flex;
  align-items: center;
  line-height: 1.2;
  }

@media (min-width: 1200px) {.tab_box01{height: 1rem!important;}}
@media (min-width: 992px) and (max-width: 1199px) {.tab_box01{height: 1rem!important;}}
@media (min-width: 768px) and (max-width: 991px) {.tab_box01{height: 1.5rem!important;}}
@media (max-width: 767px) {.tab_box01{height: 1.5rem!important;}}







/*吹き出し*/
.balloon01{
  position: relative;
  background: #243c54;
  padding: 2em;
}
.balloon01:after{
  content: "";
  position: absolute;
  right: 0;
  bottom: -20px;
  left: 0;
  width: 0px;
  height: 0px;
  margin: auto;
  border-style: solid;
  border-color: #243c54 transparent transparent transparent;
  border-width: 30px 50px 0 50px;
}

/*テキストアンダーライン*/
.txt-underline{ text-decoration: underline;}
.txt-border{border: 1px solid;}

/*両端揃え最終行右揃え*/
.txt-justify{
    text-align: justify;
    text-justify: inter-ideograph;
    -ms-text-justify: inter-ideograph;
    -ms-text-align: justify;
    }


/* -------------------------------------------------------------------------- */
/*フレックスボックス (通常マージンあり)*/
/* -------------------------------------------------------------------------- */

/*1カラムフレックスボックス　padding20ーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
@media (min-width: 992px){
.contentsColumn1{margin: 0px 0 30px 0;padding:0;}
}
@media (max-width:991px){
.contentsColumn1{margin: 0px 0 10px 0;padding:0;}
}   

	
/*ボックス親*/	
.contentsColumn1 {
    display: -webkit-flex;display: -moz-flex;display: -ms-flex;display: -o-flex;display: flex;
	-webkit-justify-content :center;-moz-justify-content :center;-ms-justify-content :center;-o-justify-content :center;justify-content :center;
	-webkit-flex-direction:row;-moz-flex-direction:row;-ms-flex-direction:row;-o-flex-direction:row;flex-direction:row;
    -webkit-flex-wrap: wrap;-moz-flex-wrap: wrap;-ms-flex-wrap: wrap;-o-flex-wrap: wrap;flex-wrap: wrap;
	}
	
/*ボックス子*/	
@media (min-width: 1200px) {.contentsColumn1 .box{width: calc(100% - 10px) ;margin:0 5px 10px 5px;padding: 20px;background: #eeeeee;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}}
@media (min-width: 992px) and (max-width: 1199px){.contentsColumn1 .box{width: calc(100% - 10px) ;margin:0 5px 10px 5px;padding: 20px;background: #eeeeee;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}}
@media (min-width: 768px) and (max-width: 991px) {.contentsColumn1 .box{width: calc(100% - 0px) ;margin:0 0 10px 0;padding: 10px;background: #eeeeee;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}}
@media (max-width: 767px) {.contentsColumn1 .box{width: calc(100% - 0px) ;margin:0 0 10px 0;padding: 10px;background: #eeeeee;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}}



/*1カラムフレックスボックス　padding20ーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
@media (min-width: 992px){
.contentsColumn1{margin: 0px 0 30px 0;padding:0;}
}
@media (max-width:991px){
.contentsColumn1{margin: 0px 0 10px 0;padding:0;}
}   

	
/*ボックス親*/	
.contentsColumn1 {
    display: -webkit-flex;display: -moz-flex;display: -ms-flex;display: -o-flex;display: flex;
	-webkit-justify-content :center;-moz-justify-content :center;-ms-justify-content :center;-o-justify-content :center;justify-content :center;
	-webkit-flex-direction:row;-moz-flex-direction:row;-ms-flex-direction:row;-o-flex-direction:row;flex-direction:row;
    -webkit-flex-wrap: wrap;-moz-flex-wrap: wrap;-ms-flex-wrap: wrap;-o-flex-wrap: wrap;flex-wrap: wrap;
	}
	
/*ボックス子*/	
@media (min-width: 1200px) {.contentsColumn1 .box{width: calc(100% - 10px) ;margin:0 5px 10px 5px;padding: 20px;background: #eeeeee;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}}
@media (min-width: 992px) and (max-width: 1199px){.contentsColumn1 .box{width: calc(100% - 10px) ;margin:0 5px 10px 5px;padding: 20px;background: #eeeeee;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}}
@media (min-width: 768px) and (max-width: 991px) {.contentsColumn1 .box{width: calc(100% - 0px) ;margin:0 0 10px 0;padding: 10px;background: #eeeeee;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}}
@media (max-width: 767px) {.contentsColumn1 .box{width: calc(100% - 0px) ;margin:0 0 10px 0;padding: 10px;background: #eeeeee;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}}


/*2カラムフレックスボックスーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
@media (min-width: 992px){
.contentsColumn2{margin: 0px 0 10px 0;padding:0;}
}
@media (max-width:991px){
.contentsColumn2{margin: 0px 0 10px 0;padding:0;}
}   

	
/*ボックス親*/	
.contentsColumn2 {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
	
	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	-ms-justify-content: space-between;
	-o-justify-content: space-between;
	justify-content: space-between;
	
	-webkit-flex-direction:row;
	-moz-flex-direction:row;
	-ms-flex-direction:row;
	-o-flex-direction:row;
	flex-direction:row;

	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	}
	
/*ボックス子*/	
@media (min-width: 1200px) {.contentsColumn2 .box{width: calc(50% - 10px) ;margin:0 5px 10px 5px;padding: 20px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}}
@media (min-width: 992px) and (max-width: 1199px){.contentsColumn2 .box{width: calc(50% - 10px) ;margin:0 5px 10px 5px;padding: 20px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}}
@media (min-width: 768px) and (max-width: 991px) {.contentsColumn2 .box{width: calc(100% - 0px) ;margin:0 0 10px 0;padding: 10px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}}
@media (max-width: 767px) {.contentsColumn2 .box{width: calc(100% - 0px) ;margin:0 0 10px 0;padding: 10px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}}



/*3カラムフレックスボックスーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
@media (min-width: 992px){
.contentsColumn3{margin: 0px 0 10px 0;padding:0;}
}
@media (max-width:991px){
.contentsColumn3{margin: 0px 0 10px 0;padding:0;}
}   

	
/*ボックス親*/	
.contentsColumn3 {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
	
	-webkit-justify-content: start;
	-moz-justify-content:  start;
	-ms-justify-content:  start;
	-o-justify-content:  start;
	justify-content:  start;
	
	-webkit-flex-direction:row;
	-moz-flex-direction:row;
	-ms-flex-direction:row;
	-o-flex-direction:row;
	flex-direction:row;

	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	}
	
/*ボックス子*/	
@media (min-width: 1200px) {.contentsColumn3 .box{width: calc(33.3333333% - 10px) ;margin:0 5px 10px 5px;padding: 20px;background: #eeeeee;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}}
@media (min-width: 992px) and (max-width: 1199px){.contentsColumn3 .box{width: calc(33.3333333% - 10px) ;margin:0 5px 10px 5px;padding: 20px;background: #eeeeee;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}}
@media (min-width: 768px) and (max-width: 991px) {.contentsColumn3 .box{width: calc(100% - 0px) ;margin:0 0 10px 0;padding: 10px;background: #eeeeee;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}}
@media (max-width: 767px) {.contentsColumn3 .box{width: calc(100% - 0px) ;margin:0 0 10px 0;padding: 10px;background: #eeeeee;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}}


/* -------------------------------------------------------------------------- */
/*動画表示*/
/* -------------------------------------------------------------------------- */  
/*ムービーボックスーーーーーーーーーーーーーーーーーーーーーーー*/
.youtubeframe iframe {margin: 0 auto 20px auto;} 

@media (min-width: 992px){.youtubeframe iframe{width:560px;	height:315px;}}
@media (max-width:991px){.youtubeframe iframe{width: 100%; height: 100%;aspect-ratio: 16/9;}}



/*br/SpPcで改行位置変更 */
/*------PC用　768px以上----------*/
@media (min-width:768px) {  
 .br-pc{ display: block;} 
 .br-sp{ display: none;}
}
/*------SP用　767px以下----------*/
@media (max-width:767px) { 
 .br-pc{ display: none;}
 .br-sp{ display: block;}
}



/*ラップフレックスボックス2ーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
/*ボックス親　*/	
.VoicewrapColumn2 {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
	
	-webkit-justify-content: space-around;
	-moz-justify-content:  space-around;
	-ms-justify-content:  space-around;
	-o-justify-content:  space-around;
	justify-content:  space-around;
	
	-webkit-flex-direction:row;
	-moz-flex-direction:row;
	-ms-flex-direction:row;
	-o-flex-direction:row;
	flex-direction:row;

	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	}
	
/*ボックス子*/	
@media (min-width: 1200px) {
.VoicewrapColumn2 .box-l{
        width: calc(30% - 0px) ;margin:0 0 10px 0;padding: 20px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; font-feature-settings : "palt";text-align: justify;text-justify: inter-ideograph;-ms-text-justify: inter-ideograph;-ms-text-align: justify;}
.VoicewrapColumn2 .box-r{
        width: calc(70% - 0px) ;margin:0 0 10px 0;padding: 20px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; font-feature-settings : "palt";text-align: justify;text-justify: inter-ideograph;-ms-text-justify: inter-ideograph;-ms-text-align: justify;}
        }        
        
@media (min-width: 992px) and (max-width: 1199px){}
@media (min-width: 768px) and (max-width: 991px) {}


@media (max-width: 767px) {
.VoicewrapColumn2 .box-l{
        width: calc(100% - 0px) ;margin:0 0 10px 0;padding: 20px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; font-feature-settings : "palt";text-align: justify;text-justify: inter-ideograph;-ms-text-justify: inter-ideograph;-ms-text-align: justify;}
.VoicewrapColumn2 .box-r{
        width: calc(100% - 0px) ;margin:0 0 10px 0;padding: 20px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; font-feature-settings : "palt";text-align: justify;text-justify: inter-ideograph;-ms-text-justify: inter-ideograph;-ms-text-align: justify;}
        }
        
        
/****************************
	吹き出し
****************************/
/*レイアウト01*/
@media (min-width: 992px){.balloon_customize {font-size: 120%;margin: 5px auto 10px auto!important;width: 50%;}}
@media (max-width:991px){.balloon_customize {font-size: 160%;margin: 5px auto 10px auto!important;width: 85%;}}

.balloon_customize {
  position: relative;
  display: block;
  padding: 10px;
  color: #000;  
  line-height: 1.0;
  background:rgba(255,255,255,0.7);
  box-sizing: border-box;
  text-align: center;
  font-feature-settings : "palt";
}


.balloon_customize:before{
  content: "";
  position: absolute;
  bottom: -24px;
  left: 50%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-top: 12px solid rgba(255,255,255,0.7);
  z-index: 2;
}

.balloon_customize:after{
  content: "";
  position: absolute;
  bottom: -30px;
  left: 50%;
  margin-left: -17px;
  border: 14px solid transparent;

  z-index: 1;
}
.balloon_customize span{color: #ff0000;}



/*レイアウト02*/
@media (min-width: 992px){.balloon_customize-color {font-size: 160%;margin: 5px auto 10px auto!important;}}
@media (max-width:991px){.balloon_customize-color {font-size: 180%;margin: 5px auto 5px auto!important;}}

.balloon_customize-color {
  position: relative;
  display: block;
  padding: 10px;
  width: 100%;
  color: #fff;  
  line-height: 1.0;
  background:#cd0a1b;
  box-sizing: border-box;
  text-align: center;
  font-feature-settings : "palt";
}

.balloon_customize-color span{color: #ffff00;font-size: 120%!important;}

/*レイアウト03*/
@media (min-width: 992px){.balloon_customize-max {font-size: 130%;margin: 5px auto 10px auto!important;width: 50%;}}
@media (max-width:991px){.balloon_customize-max {font-size: 160%;margin: 5px auto 10px auto!important;width: 85%;}}

.balloon_customize-max {
  position: relative;
  display: block;
  padding: 10px;
  color: #fff;  
  line-height: 1.2;
  background:#cd0a1b;
  box-sizing: border-box;
  text-align: center;
  font-feature-settings : "palt";
}


.balloon_customize-max:before{
  content: "";
  position: absolute;
  bottom: -24px;
  left: 50%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-top: 12px solid #cd0a1b;;
  z-index: 2;
}

.balloon_customize-max:after{
  content: "";
  position: absolute;
  bottom: -30px;
  left: 50%;
  margin-left: -17px;
  border: 14px solid transparent;

  z-index: 1;
}
.balloon_customize-max span{color: #ffff00;}


/* -------------------------------------------------------------------------- */
/*リストテキスト*/
/* -------------------------------------------------------------------------- */
/*右矢印アイコン*/
ul.listTxt-arrowRight {margin:10px 0 0 0;padding: 0px;display: block;}
ul.listTxt-arrowRight li{margin: 0 0 7px 0;padding: 0 0 0 20px;list-style-type: none;position: relative;word-break: break-all;}
ul.listTxt-arrowRight li:before {content:"※";position: absolute;left: 0px;top:1px;}
@media (min-width: 1200px) {ul.listTxt-arrowRight li{font-size: 0.20rem!important;line-height: 1.3!important; text-align: justify;text-justify: inter-ideograph;-ms-text-justify: inter-ideograph;-ms-text-align: justify;}}
@media (min-width: 992px) and (max-width: 1199px){ul.listTxt-arrowRight li{font-size: 0.20rem!important;line-height: 1.3!important; text-align: justify;text-justify: inter-ideograph;-ms-text-justify: inter-ideograph;-ms-text-align: justify;}}
@media (min-width: 768px) and (max-width: 991px) {ul.listTxt-arrowRight li{font-size: 30rem!important;line-height: 1.3!important; text-align: justify;text-justify: inter-ideograph;-ms-text-justify: inter-ideograph;-ms-text-align: justify;}}
@media (max-width: 767px) {ul.listTxt-arrowRight li{font-size: 0.30rem!important;line-height: 1.3!important; text-align: justify;text-justify: inter-ideograph;-ms-text-justify: inter-ideograph;-ms-text-align: justify;}}


.textDecoration-shadow{
  text-shadow:
           1px 1px 0px #A3141F, -1px -1px 0px #A3141F,
          -1px 1px 0px #A3141F,  1px -1px 0px #A3141F,
           1px 0px 0px #A3141F, -1px  0px 0px #A3141F,
           0px 1px 0px #A3141F,  0px -1px 0px #A3141F!important;}


/* -------------------------------------------------------------------------- */
/*バナー画像*/
/* -------------------------------------------------------------------------- */
.bannerContents-Area{margin:30px auto 0 auto;display: block;padding:0;text-align: center!important;}
.bannerContents-Area img{width: 100%;margin:0 auto!important;padding:0;text-align: center!important;}

@media (min-width:992px){.bannerContents-Area{width: 90%;}}
@media (max-width:991px){.bannerContents-Area{width: 95%;}}


/*テキストスタイル　ミニアム(小)*/
@media (min-width:992px){.p-min{margin: 0 0 10px 0;font-size: 90%!important;line-height: 1.2!important; text-align: justify;text-justify: inter-ideograph;-ms-text-justify: inter-ideograph;-ms-text-align: justify;clear: both;}}
@media (max-width:991px){.p-min{margin: 0 0 10px 0;font-size: 150%!important;line-height: 1.2!important; text-align: justify;text-justify: inter-ideograph;-ms-text-justify: inter-ideograph;-ms-text-align: justify;clear: both;}}
.p-min:last-child{margin: 0 0 0px 0;}


/* -------------------------------------------------------------------------- */
/*リストテキスト*/
/* -------------------------------------------------------------------------- */
/*カウントアイコン*/
ul.listTxt-count {margin:0 0 25px 25px;padding: 0px;display: block;}
ul.listTxt-count li{margin: 0 0 7px 0;padding: 0 0 0 5px;list-style-type: decimal;word-break: break-all;font-feature-settings : "palt";}
@media (min-width:992px){ul.listTxt-count li{font-size: 120%!important;line-height: 1.3!important; text-align: justify;text-justify: inter-ideograph;-ms-text-justify: inter-ideograph;-ms-text-align: justify;}}
@media (max-width:991px){ul.listTxt-count li{font-size: 190%!important;line-height: 1.3!important; text-align: justify;text-justify: inter-ideograph;-ms-text-justify: inter-ideograph;-ms-text-align: justify;}}


/*チェックアイコン*/
ul.listTxt-check {margin:0;padding: 0px;display: block;}
ul.listTxt-check li{margin: 0 0 7px 0;padding: 0 0 0 20px;list-style-type: none;position: relative;font-feature-settings : "palt";}
ul.listTxt-check li:before {content:"\f14a";font-family: "fontawesome";position: absolute;left: 0px;top:1px;word-break: break-all;}
@media (min-width:992px){ul.listTxt-check li{font-size: 120%!important;line-height: 1.3!important; text-align: justify;text-justify: inter-ideograph;-ms-text-justify: inter-ideograph;-ms-text-align: justify;}}
@media (max-width:991px){ul.listTxt-check li{font-size: 190%!important;line-height: 1.3!important; text-align: justify;text-justify: inter-ideograph;-ms-text-justify: inter-ideograph;-ms-text-align: justify;}}



/* -------------------------------------------------------------------------- */
/*リスキリング支援事業*/
/* -------------------------------------------------------------------------- */
.reskilling_area{
    margin:0 auto;
    padding: 20px;
    width: 100%;
    border: 3px #e50112 solid;
    display: block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    }
@media (min-width:992px){.reskilling_area{padding:20px;}}
@media (max-width:991px){.reskilling_area{padding:10px;}}

.reskilling_area .inner{
    margin:0 0 30px 0;
    padding:0;
    width: 100%;
    display: block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    }
    
.reskilling_area .lineBox{
    margin:0;
    padding:10px;
    width: 100%;
    display: block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 2px #cccccc dotted;
    }
    
.reskilling_area .grayBox{
    margin:0;
    padding:10px;
    width: 100%;
    display: block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background: #eeeeee;
    }

/*見出しh3ーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.reskilling_area h3{
    margin:0 auto 10px auto;
    background: #e50112;
    color: #ffffff;
    padding: 10px;
    font-weight: bold;
}
@media (min-width:992px){.reskilling_area h3{font-size: 150%;}}
@media (max-width:991px){.reskilling_area h3{font-size: 210%;}}

/*見出しh4ーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.reskilling_area h4{
    margin:0 auto 10px auto;
    border-bottom: 2px #222222 solid;
    color: #222222;
    padding: 0 0 5px 0;
    font-weight: bold;
    line-height: 1.2;
}
@media (min-width:992px){.reskilling_area h4{font-size: 130%;}}
@media (max-width:991px){.reskilling_area h4{font-size: 190%;}}

/*見出しh5ーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.reskilling_area h5{text-align:center;margin:0 0 10px 0;padding:0px;color:#e50012;font-weight: bold;position:relative;}
.reskilling_area h5:before{content: "";margin: 0;border: 1px solid #e50012;height: 30px; top: -5px;transform: translateY(-50%);-webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);position:absolute;transform: rotate(-20deg);}
.reskilling_area h5:after{content: "";margin: 0;border: 1px solid #e50012;height: 30px;top: -5px;transform: translateY(-50%);-webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);position:absolute;transform: rotate(20deg);}
.reskilling_area h5 span{margin:3px auto 0 auto;padding:7px; display: block;color:#333333;font-weight:bold;text-decoration: underline;}

@media (min-width: 992px){.reskilling_area h5{font-size: 150%;line-height: 1.0;}.reskilling_area h5 span{font-size: 100%;width: 60%;}.reskilling_area h5:before{left: 25%;}.reskilling_area h5:after{right:25%;}}
@media (max-width:991px){.reskilling_area h5{font-size: 220%;line-height: 1.0;}.reskilling_area h5 span{font-size: 100%;width: 100%;}.reskilling_area h5:before{left: 2px;}.reskilling_area h5:after{right: 2px;}}


/*リスキリングロゴーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
@media (min-width:992px){.reskilling_area .logo img{margin: 0 0 10px 20px;padding: 0;width: 250px;float: right;}}
@media (max-width:991px){.reskilling_area .logo img{margin: 0 0 10px 0;padding: 0;width: 100%;}}


/*テキストーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.reskilling_area .inner p{
    margin:0 auto 10px auto;
    padding: 0;
    text-align: justify;
    text-justify: inter-ideograph;
    -ms-text-justify: inter-ideograph;
    -ms-text-align: justify;    
}
@media (min-width:992px){.reskilling_area .inner p{font-size: 120%;line-height: 1.4;}}
@media (max-width:991px){.reskilling_area .inner p{font-size: 190%;line-height: 1.5;}}

/*margin打消しーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.reskilling_area .inner p:last-child{margin:0 auto 0 auto;}
.reskilling_area .inner:last-child{margin:0 0 0 0;}

/*リンクーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.reskilling_area a:link   {text-decoration: none;display: block;}
.reskilling_area a:visited{text-decoration: none;display: block;}
.reskilling_area a:active {text-decoration: none;display: block;}
.reskilling_area a:hover  {text-decoration: none;display: block;filter: alpha(opacity=50);-moz-opacity:0.50;opacity:0.50;}





/* -------------------------------------------------------------------------- */
/*テキストリンクボタンエリア(2column)*/
/* -------------------------------------------------------------------------- */
.linkbtnArea_2column{
    margin: 0!important;
    padding: 0!important;
	display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;

	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	-o-justify-content: center;
	justify-content: center;
	
	-webkit-flex-direction:row;
	-moz-flex-direction:row;
	-ms-flex-direction:row;
	-o-flex-direction:row;
	flex-direction:row;

	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	}
	
.linkbtnArea_2column a:hover{filter: alpha(opacity=50);-moz-opacity:0.50;opacity:0.50;}

@media (min-width: 992px){
    .linkbtnArea_2column .box{
	    width: calc(50% - 10px);
	    margin: 5px;
	    padding: 0;
	    -webkit-box-sizing: border-box;
	    -moz-box-sizing: border-box;
	    box-sizing: border-box;
	    }}
@media (max-width:991px){
    .linkbtnArea_2column .box{
	    width: calc(100% - 10px);
	    margin: 5px;
	    padding: 0;
	    -webkit-box-sizing: border-box;
	    -moz-box-sizing: border-box;
	    box-sizing: border-box;
	    }}



/* -------------------------------------------------------------------------- */
/*DIV型リンクボタン*/
/* -------------------------------------------------------------------------- */
/*DIV型リンクボタン　カラー：グレーーーーーーーーーーーーーーーーーーーーーーー*/
.common-noneActiveButton{
    margin:5px 0;
    width: 100%;
    border:1px solid #dddddd;
    box-shadow:inset 0px 1px 0px 0px #e6e6e6;
	background:linear-gradient(to bottom, #cccccc 5%, #b3b3b3 100%);
	background-color:#cccccc;
    text-align: center;
    border-radius:3px;
    color: #ffffff;
    }
    
@media (min-width: 992px){
    .common-noneActiveButton{font-size: 1.2em;line-height:1.2;padding:10px 0;}
    .common-grayButton   a{font-size: 120%;line-height:1.2;padding:10px 0;}
    .common-blueButton   a{font-size: 120%;line-height:1.2;padding:10px 0;}
    .common-redButton    a{font-size: 120%;line-height:1.2;padding:10px 0;}
    .common-greenButton  a{font-size: 120%;line-height:1.2;padding:10px 0;}
    .common-purpleButton a{font-size: 120%;line-height:1.2;padding:10px 0;}
    .common-orangeButton a{font-size: 120%;line-height:1.2;padding:10px 0;}
    .common-yellowButton a{font-size: 120%;line-height:1.2;padding:10px 0;}
    }
    
@media (max-width:991px){
    .common-noneActiveButton{font-size: 220%;line-height:1.2;padding:15px 0;}
    .common-grayButton   a{font-size: 220%;line-height:1.2;padding:15px 0;}
    .common-blueButton   a{font-size: 220%;line-height:1.2;padding:15px 0;}
    .common-redButton    a{font-size: 220%;line-height:1.2;padding:15px 0;}
    .common-greenButton  a{font-size: 220%;line-height:1.2;padding:15px 0;}
    .common-purpleButton a{font-size: 220%;line-height:1.2;padding:15px 0;}
    .common-orangeButton a{font-size: 220%;line-height:1.2;padding:15px 0;}
    .common-yellowButton a{font-size: 220%;line-height:1.2;padding:15px 0;}
    }


/*DIV型リンクボタン　カラー：グレーーーーーーーーーーーーーーーーーーーーーーー*/
.common-grayButton{
    margin:5px 0;
    width: 100%;
    border:1px solid #808080;
    text-shadow:0px 1px 0px #f2f2f2;
    box-shadow:inset 0px 1px 0px 0px #e6e6e6;
	background:linear-gradient(to bottom, #cccccc 5%, #b3b3b3 100%);
	background-color:#cccccc;
    text-align: center;
    border-radius:3px;
    }

.common-grayButton a:link   {color:#000000;text-decoration: none;display: block;}
.common-grayButton a:visited{color:#000000;text-decoration: none;display: block;}
.common-grayButton a:active {color:#000000;text-decoration: none;display: block;}
.common-grayButton a:hover  {color:#000000; text-decoration:none;background:linear-gradient(to bottom, #b3b3b3 5%, #cccccc 100%);background-color:#b3b3b3; display:block;}


/*DIV型リンクボタン　カラー：イエローーーーーーーーーーーーーーーーーーーーーーー*/
.common-yellowButton{
    margin:5px 0;
    width: 100%;
    border:1px solid #d3d30f;
    text-shadow:0px 1px 0px #fffdd4;
    box-shadow:inset 0px 1px 0px 0px #fffc8d;
	background:linear-gradient(to bottom, #ffff00 5%, #ffdb27 100%);
	background-color:#ffff00;
    text-align: center;
    border-radius:3px;
    }

.common-yellowButton a:link   {color:#000000;text-decoration: none;display: block;}
.common-yellowButton a:visited{color:#000000;text-decoration: none;display: block;}
.common-yellowButton a:active {color:#000000;text-decoration: none;display: block;}
.common-yellowButton a:hover  {color:#000000; text-decoration:none;background:linear-gradient(to bottom, #ffdb27 5%, #ffff00 100%);background-color:#ffdb27; display:block;}


/*DIV型リンクボタン　カラー：ブルーーーーーーーーーーーーーーーーーーーーーーーー*/
.common-blueButton{
    margin:5px 0;
    width: 100%;
    border:1px solid #124d77;
    text-shadow:0px 1px 0px #154682;
    box-shadow:inset 0px 1px 0px 0px #54a3f7;
	background:linear-gradient(to bottom, #007dc1 5%, #0061a7 100%);
	background-color:#007dc1;
    text-align: center;
    border-radius:3px;
    }

.common-blueButton a:link   {color:#ffffff;text-decoration: none;display: block;}
.common-blueButton a:visited{color:#ffffff;text-decoration: none;display: block;}
.common-blueButton a:active {color:#ffffff;text-decoration: none;display: block;}
.common-blueButton a:hover  {color:#ffffff; text-decoration:none;background:linear-gradient(to bottom, #0061a7 5%, #007dc1 100%);background-color:#0061a7; display:block;}


/*DIV型リンクボタン　カラー：レッドーーーーーーーーーーーーーーーーーーーーーーーー*/
.common-redButton{
    margin:5px 0;
    width: 100%;
    border:1px solid #ad0e29;
    text-shadow:0px 1px 0px #c1272d;
    box-shadow:inset 0px 1px 0px 0px #ff7676;
	background:linear-gradient(to bottom, #ed1c24 5%, #bc1931 100%);
	background-color:#bc1931;
    text-align: center;
    border-radius:3px;
    }

.common-redButton a:link   {color:#ffffff;text-decoration: none;display: block;}
.common-redButton a:visited{color:#ffffff;text-decoration: none;display: block;}
.common-redButton a:active {color:#ffffff;text-decoration: none;display: block;}
.common-redButton a:hover  {color:#ffffff; text-decoration:none;background:linear-gradient(to bottom, #bc1931 5%, #ed1c24 100%);background-color:#bc1931; display:block;}


/*DIV型リンクボタン　カラー：グリーンーーーーーーーーーーーーーーーーーーーーーーーー*/
.common-greenButton{
    margin:5px 0;
    width: 100%;
    border:1px solid #006837;
    text-shadow:0px 1px 0px #2d7a54;
    box-shadow:inset 0px 1px 0px 0px #52a05a;
	background:linear-gradient(to bottom, #23a35d 5%, #00602b 100%);
	background-color:#00602b;
    text-align: center;
    border-radius:3px;
    }

.common-greenButton a:link   {color:#ffffff;text-decoration: none;display: block;}
.common-greenButton a:visited{color:#ffffff;text-decoration: none;display: block;}
.common-greenButton a:active {color:#ffffff;text-decoration: none;display: block;}
.common-greenButton a:hover  {color:#ffffff; text-decoration:none;background:linear-gradient(to bottom, #00602b 5%,  100%);background-color:#00602b; display:block;}


/*DIV型リンクボタン　カラー：オレンジーーーーーーーーーーーーーーーーーーーーーーーー*/
.common-orangeButton{
    margin:5px 0;
    width: 100%;
    border:1px solid #f25220;
    text-shadow:0px 1px 0px #f23420;
    box-shadow:inset 0px 1px 0px 0px #f2a620;
	background:linear-gradient(to bottom, #f4901e 5%, #f23f20 100%);
	background-color:#f23f20;
    text-align: center;
    border-radius:3px;
    }

.common-orangeButton a:link   {color:#ffffff;text-decoration: none;display: block;}
.common-orangeButton a:visited{color:#ffffff;text-decoration: none;display: block;}
.common-orangeButton a:active {color:#ffffff;text-decoration: none;display: block;}
.common-orangeButton a:hover  {color:#ffffff; text-decoration:none;background:linear-gradient(to bottom, #f23f20 5%, #f4901e 100%);background-color:#f23f20; display:block;}


/*DIV型リンクボタン　カラー：パープルーーーーーーーーーーーーーーーーーーーーーーーー*/
.common-purpleButton{
    margin:5px 0;
    width: 100%;
    border:1px solid #9327a3;
    text-shadow:0px 1px 0px #5409c1;
    box-shadow:inset 0px 1px 0px 0px #b72ab7;
	background:linear-gradient(to bottom, #8b24ba 5%, #62006d 100%);
	background-color:#62006d;
    text-align: center;
    border-radius:3px;
    }

.common-purpleButton a:link   {color:#ffffff;text-decoration: none;display: block;}
.common-purpleButton a:visited{color:#ffffff;text-decoration: none;display: block;}
.common-purpleButton a:active {color:#ffffff;text-decoration: none;display: block;}
.common-purpleButton a:hover  {color:#ffffff; text-decoration:none;background:linear-gradient(to bottom, #62006d 5%, #8b24ba 100%);background-color:#62006d; display:block;}



