@charset "UTF-8";
/*!
 *  SDGs
 */
 
@import url('https://fonts.googleapis.com/css2?family=Ms+Madi&family=Noto+Sans+JP:wght@100;400;700&family=RocknRoll+One&display=swap');


/**
 *  基本フォントサイズやリンクカラーなど
 */

body {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 12pt;
}

a:link {
    color: #212529;
}
a:visited {
    color: #212529;
}
a:hover {
    color: #81da83;
}
a:active {
    color: #81da83;
}


main h1 {
	margin: 40px 0 40px 0;
	text-align: center;
	font-size: 190%;
	font-weight: bold;
}
main h2 {
    margin: 0 0 40px 0;
    text-align: center;
    font-size: 180%;
    font-weight: bold;
}
main h3 {
    margin: 30px 0 10px 0;
    text-align: left;
    font-weight: 700;
    font-size: 150%;
    line-height: 1.5;
}
main h4 {
    margin: 20px 0 5px 0;
    text-align: left;
    font-weight: 700;
    font-size: 120%;
}

@media (max-width: 1399.98px) {
}
@media (max-width: 1199.98px) {
}
@media (max-width: 991.98px) {
}
@media (max-width: 767.98px) {
}
@media (max-width: 575.98px) {
    main h1 {
        font-size: 150%;
    }
    main h2 {
        font-size: 150%;
    }
    main h3 {
        font-size: 120%;
    }
    main h4 {
        font-size: 110%;
    }
}


main section {
    margin: 0;
    padding: 60px 0;
}

/**
 *  メインビジュアル
 */
#slideMain {
	position: relative;
}
#mainvisualtop{
	padding: 0;
	max-width: 100%;
	background-size: cover;
	background-position: center;
	position: relative;
}
#main-logo {
    position: absolute;
    z-index: 10;
    top: 10%;
    left: 8%;
    box-shadow: 0px 0px 15px white;
}

@media (max-width: 1399.98px) {
    #main-logo img { 
		width: 350px; 
	}
}
@media (max-width: 1199.98px) {
    #main-logo img {
		width: 300px; 
	}
}
@media (max-width: 991.98px) {
    #main-logo img {
		width: 250px; 
	}
}
@media (max-width: 767.98px) {
    #main-logo img {
		width: 200px; 
	}
}
@media (max-width: 575.98px) {
    #main-logo img { 
		width: 200px; 
	}
    #main-logo { 
		left: 15px; 
	}
}

/* トップナビ */
section#lead {
    margin-top: -120px;
    background-color: #f9f9f7;
    background-image: url(../img/bgov-1.png);
    background-size: cover;
}
    section#lead h4 {
	    color: #fd4f0c;
    }
    section#lead a.top-navi {
        display: block;
	    border: solid 3px #7dd1fd;
        background: #fff;
        color: #33C4F1;
        text-align: center;
        padding: 1.75rem 0.25rem;
        border-radius: 10px;
        box-shadow: 0px 0px 8px #fff;
        position: relative;
        }
    section#lead a.top-navi em {
        font-style: normal;
        font-weight: bold;
        font-size: 150%;
        }
    section#lead a.top-navi:hover {
        background: #7dd1fd;
        color: #fff;
        transition: 0.5s;
        }
    @media (max-width: 991.98px) {
    section#lead a.top-navi em {
	    font-style: normal;
	    font-weight: bold;
	    font-size: 120%;
        }
    }
    @media (max-width: 575.98px) {
    section#lead a.top-navi {
	    padding: 1.75rem 0.5rem;
    }
    section#lead a.top-navi em {
	    font-style: normal;
	    font-weight: bold;
	    font-size: 100%;
    }
    }

section#movie {
	background-color: #fff;
}
section#movie .movie-wrap {
    max-width: 100%; 
}
section#movie .movie {
    position: relative;
    width:100%; 
    height:0; 
    padding-top: 56.25%; 
}
section#movie .movie iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

section#feature {
    background-color: #7dd1fd;
    background-image: url();
    background-size: cover;
}
section#feature h2 {
	color : #fff;
}

section#plan {
    background-color: #E8EBF0;
    background-image: url(../img/bgov-3.png);
    background-size: cover;
}
section#plan .plan-contents{
    margin: 30px 0;
}

section#plan .type1 {
    display: inline-block;
    position: absolute;
    left: 10px;
    top: 10px;
    background: rgba(117,185,92,1);
    color: #fff;
    padding: 0.5em;
    line-height: 1;
    border-radius: 5px;
}
section#plan .type2 {
    display: inline-block;
    position: absolute;
    left: 10px;
    top: 10px;
    background: rgba(156,229,251,1);
    padding: 0.5em;
    line-height: 1;
    border-radius: 5px;
}
section#plan .type3 {
    display: inline-block;
    position: absolute;
    left: 10px;
    top: 10px;
    background: rgba(255,80,11,1);
    color: #fff;
    padding: 0.5em;
    line-height: 1;
    border-radius: 5px;
}
section#plan .h3_title {
	    margin-bottom: 2.0rem;
	    text-align: center;
        font-weight: bold;
}
section#plan .h3_title h3 {
	    display: inline-block;
	    padding: 0.25rem 2.0rem;
	    border-radius: 2.5rem;
	    font-weight: bold; 
}
section#plan .h3_title h3.color1 {
	    background: #75b95c;
	    color: #fff; 
}
section#plan .h3_title h3.color2 {
	    background: #9ce5fb;
}
section#plan .h3_title h3.color3 {
	    background: #ff500b;
	    color: #fff; 
}
section#plan .outline {
	    font-weight: bold;
}

section#plan a:link {
    color: #404040;
}
section#plan a:visited {
    color: #404040;
}
section#plan a:hover {
    color: #fff;
}
section#plan a:active {
    color: #fff;
}
section#lineup h2 {
}

section#lineup a:link {
    color: #0d6efd;
}
section#lineup a:hover {
    color: #fff;
}
section#lineup {
    background-color: #81da83;
}
section#lineup-02,section#lineup-04,section#lineup-06 {
    background-color: #ffe67f;
    background-image: url(../img/bgov-1.png);
    background-size: cover;
}
section#lineup-03,section#lineup-05,section#lineup-07 {
    background-color: #81da83;
    background-image: url(../img/bgov-2.png);
    background-size: cover;
}
section#lineup h3,section#lineup-02 h3,section#lineup-03 h3,section#lineup-04 h3,section#lineup-05 h3,section#lineup-06 h3,section#lineup-07 h3 {
    margin: 0 0 10px 0;
}

@media (max-width: 575.98px) {
section#lineup h3,section#lineup-02 h3,section#lineup-03 h3,section#lineup-04 h3,section#lineup-05 h3,section#lineup-06 h3,section#lineup-07 h3{
    margin: -10px 0 10px 0;
    }
}


section#case {
    background-color: #FFF9DA;
	background-image: url(../img/bgov-3.png);
    background-size: cover;
}

.btn {
    border-radius: 0.3rem;
    line-height: 1.2;
    padding: 0.5rem 1rem;
}
.btn-op {
    color: #fff !important;
    background-color: #e86345;
    border-color: #e86345;
}
.btn-op:hover {
    color: #e86345 !important;
    background-color: #fff;
    border-color: #e86345;
    transition: 0.5s;
}
.navbar-toggler:focus {
  text-decoration: none;
  outline: 0;
  box-shadow: none !important;
}

.card {
    border-color: rgba(0,0,0,0.1);
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
.card-body {
    padding: 1rem 1.5rem;
}
.card-title {
    color: #404040;
    text-align: center;
    font-size: 110%;
    font-weight: bold;
    padding: 0 0 0.8rem 0;
    margin: 0 0 0.8rem 0;
    border-bottom: dashed 2px #ffb6b9;
}

.card-title-feature {
    color: #404040;
    text-align: center;
    font-size: 110%;
    font-weight: bold;
    padding: 0 0 0.8rem 0;
    margin: 0 0 0.8rem 0;
    border-bottom: dashed 2px #51b17c;
}

.card-title-case {
    color: #404040;
    text-align: center;
    font-size: 110%;
    font-weight: bold;
    padding: 0 0 0.8rem 0;
    margin: 0 0 0.8rem 0;
    border-bottom: dashed 2px #51b17c;
}

.card-title-only {
    color: #404040;
    text-align: center;
    font-size: 110%;
    font-weight: bold;
    padding: 0;
    margin: 0;
}

.card-text {
	color: #404040;
}

.r-panel {
    padding: 40px 25px 25px 25px;
    background: rgba(255,255,255,0.9);
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    border-radius: 10px;
}
.bc-w {
    background-color: #fff;
}
.bc-w50 {
    background-color: rgba(255,255,255,0.5);
}
.bc-y {
    background-color: #fffdcd;
}
.bc-p {
    background-color: #ffe6df;
}

.circle1 {
  position: relative;
  display: inline-block;
  width: 17.5rem;
  height: 17.5rem;
  border-radius: 50%;
  background-color: #75b95c;
}

.circle2 {
  position: relative;
  display: inline-block;
  width: 17.5rem;
  height: 17.5rem;
  border-radius: 50%;
  background-color: #9ce5fb;
}

.circle3 {
  position: relative;
  display: inline-block;
  width: 17.5rem;
  height: 17.5rem;
  border-radius: 50%;
  background-color: #ff500b;
}

.circle1 p,.circle2 p,.circle3 p {
  position: absolute;
  display: inline-block;
  left: 0;
  top: 30%;
  -webkit-transform: translateY(-70%);
  transform: translateY(-70%);
  width :17.5rem;
  text-align:center;
  font-size: 100%;
  font-weight: bold;
  padding: 0 1rem;
}

.circle1 span,.circle2 span,.circle3 span {
  position: absolute;
  display: inline-block;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-25%);
  transform: translateY(-25%);
  width :17.5rem;
  text-align:center;
  font-size: 180%;
  font-weight: bold;
  padding: 0 1.5rem;
}



/* 共通部分オーバーライド */
.contact_section {
    background: #7dd1fd !important;
}
.h2_title{
	margin-bottom: 0rem !important;
}
.h2_title h2.color2 {
	background: #ffffff;
	color: #7dd1fd;
}
.contact_section .contact_container .contact_inner .tel i {
    color: #7dd1fd;
}
.h2_title h2.company{
	margin-bottom: 2.0rem !important;
	background: #7dd1fd;
	color: #fff;
}
.pagetop_section a {
    background: #404040;
    border: 0.0625rem solid #404040;
    color: #ffffff;
}


/**
 *  レスポンシブ調整用
 */
@media (max-width: 1399.98px) {
}
@media (max-width: 1199.98px) {
}
@media (max-width: 991.98px) {
}
@media (max-width: 767.98px) {
.contact_section .h2_title h2 {
        font-size: 1.125rem; 
	} 
.company_section .h2_title h2 {
        font-size: 1.125rem; 
	} 
}

@media (max-width: 575.98px) {
.contact_section .h2_title h2 {
	font-size: 1.25rem;
	border-radius: 2.5rem;
}
.company_section .h2_title h2 {
	font-size: 1.25rem;
	border-radius: 2.5rem;
}
}

@media (min-width: 991.98px){
	.spbr{
	display: none;
	}
}
@media (max-width: 767.98px){
	.pcbr{
	display: none;
	}
}
@media (max-width: 375px) {
	p {
	font-size: 0.875rem;
	}
}