@charset "utf-8";

/* .cont */
.cont {
  padding: 90px 0;
}
.cont .tit1 {
  margin-bottom: 30px;
  font-size: 20px;
}
.cont .tit1 span {
  display: block;
  font-size: 48px;
  font-weight: 200;
}
.cont .tit1 span img {
  display: block;
  width: 60px;
  margin: 0 auto 0.3em;
}
.cont .tit2 {
  font-size: 26px;
  color: #294667;
}

@media screen and (max-width: 768px) {
  .cont {
    padding: 9% 0;
  }
  .cont .tit1 {
    margin-bottom: 3%;
    font-size: 3.4vw;
  }
  .cont .tit1 span {
    font-size: 6.5vw;
  }
  .cont .tit1 span img {
    width: 1.2em;
  }
  .cont .tit2 {
    font-size: 4.5vw;
  }
}

/* #cont1 */
#cont1 {
}

#cont1 .top__fv {
  width: 100%;
}
#cont1 section {
  margin-top: 1%;
}
#cont1 section h2 {
  max-width: 480px;
  margin: 0 auto 50px;
}
#cont1 section ul {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
#cont1 section ul li {
  width: 31%;
  padding: 3% 2%;
  background-color: rgba(255, 255, 255, 0.8);
  border-radius: 1em;
}
#cont1 section ul li figure img {
  width: 45%;
}
#cont1 section ul li figure {
  font-size: 28px;
  font-weight: bold;
}
#cont1 section ul li figure figcaption {
  margin: 0.5em 0;
}
#cont1 section ul li p {
  text-align: left;
}

@media screen and (max-width: 768px) {
  #cont1 section {
    margin-top: 8%;
  }
  #cont1 section h2 {
    max-width: 480px;
    width: 70%;
    margin: 0 auto 5%;
  }
  #cont1 section ul {
    display: block;
  }
  #cont1 section ul li {
    width: auto;
    padding: 3% 0;
    background-color: transparent;
  }
  #cont1 section ul li figure {
    margin-bottom: 0.3em;
    font-size: 5vw;
    text-align: left;
  }
  #cont1 section ul li figure img {
    width: 2em;
  }
  #cont1 section ul li figure figcaption {
    display: inline-block;
    margin: 0;
  }
  #cont1 section ul li p {
    text-align: left;
  }
}

/* #cont2 */
#cont2 {
  background: url(../images/top/cont2_bg.jpg) no-repeat center bottom;
  background-size: 1000px auto;
}
#cont2 h2 {
  margin-bottom: 70px;
  font-size: 40px;
  font-weight: 900;
}
#cont2 h2 .small {
  display: block;
  font-size: 26px;
}
#cont2 h2 .large {
  display: inline-block;
  line-height: 1;
  font-size: 61px;
}
#cont2 h2 .large rt {
  line-height: 0.5;
  font-size: 45px;
}
#cont2 ul li {
  margin-top: 1em;
  display: -webkit-flex;
  display: flex;
  line-height: 1.3;
  font-size: 24px;
  font-weight: bold;
}
#cont2 ul li > span {
  line-height: 0.8;
  display: block;
  width: 1em;
  font-size: 68px;
  transform: translateY(0.03em);
}
#cont2 ul li p {
  display: block;
  padding-left: 0.8em;
  text-align: left;
  border-left: 1px solid;
}
#cont2 ul li p .line {
  background: linear-gradient(transparent 60%, #ffff00 60%);
}

@media screen and (max-width: 1024px) {
  #cont2 {
    padding-bottom: 8%;
    background-size: 100% auto;
  }
  #cont2 ul li {
    font-size: 2.4vw;
  }
  #cont2 ul li > span {
    font-size: 6.8vw;
  }
}

@media screen and (max-width: 768px) {
  #cont2 {
    background: url(../images/top/cont2_bg_s.jpg) no-repeat center bottom;
    background-size: 100% auto;
  }
  #cont2 h2 {
    margin-bottom: 7%;
    font-size: 5vw;
  }
  #cont2 h2 .small {
    line-height: 2;
    display: block;
    font-size: 3.8vw;
  }
  #cont2 h2 .large {
    display: inline-block;
    line-height: 1;
    font-size: 7vw;
  }
  #cont2 h2 .large rt {
    font-size: 5vw;
  }
  #cont2 ul li {
    font-size: 3.8vw;
  }
  #cont2 ul li > span {
    font-size: 11vw;
  }
}

/* #cont3 */
#cont3 {
  padding-top: 0;
}
#cont3 h2 {
  margin-bottom: 30px;
  padding: 1.2em 0;
  font-size: 32px;
  position: relative;
}
#cont3 h2:after {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 1em 1em 0 1em;
  border-color: #0092d7 transparent transparent transparent;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
}
#cont3 ul {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
#cont3 ul li {
  width: 48%;
  margin-top: 5%;
}
#cont3 ul li figure figcaption {
  margin: 0.5em 0;
  font-size: 26px;
  font-weight: 900;
}
#cont3 ul li p {
  text-align: left;
}

@media screen and (max-width: 1024px) {
  #cont3 h2 {
    padding: 1em 0;
  }
  #cont3 h2 span {
    display: block;
  }
}

@media screen and (max-width: 768px) {
  #cont3 {
    padding-top: 5%;
  }
  #cont3 h2 {
    margin-bottom: 9%;
    font-size: 5vw;
  }
  #cont3 ul {
    display: block;
  }
  #cont3 ul li {
    width: auto;
    margin-top: 9%;
  }
  #cont3 ul li figure figcaption {
    margin: 0.8em 0;
    font-size: 4.5vw;
  }
}

/* #cont4 */
#cont4 {
  background: url(../images/top/bg.png) repeat-x center top;
  background-size: 50px auto;
}
#cont4 ul {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
#cont4 ul li {
  width: 48%;
  margin-top: 5%;
}
#cont4 ul li figure figcaption {
  margin-bottom: 1.5em;
  line-height: 2.4;
  font-size: 24px;
  font-weight: 900;
  border-radius: 1.2em;
  position: relative;
}
#cont4 ul li figure figcaption:after {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0.7em 0.7em 0 0.7em;
  border-color: #0092d7 transparent transparent transparent;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
}
#cont4 ul li p {
  margin-top: 1em;
  text-align: left;
}

@media screen and (max-width: 1024px) {
  #cont4 ul li figure figcaption {
    font-size: 2.4vw;
  }
}

@media screen and (max-width: 768px) {
  #cont4 {
    background: url(../images/top/bg.png) repeat-x center top;
    background-size: 9% auto;
  }
  #cont4 ul {
    display: block;
  }
  #cont4 ul li {
    width: auto;
    margin-top: 9%;
  }
  #cont4 ul li figure figcaption {
    font-size: 4.5vw;
  }
  #cont4 ul li figure figcaption:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0.7em 0.7em 0 0.7em;
    border-color: #0092d7 transparent transparent transparent;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
  }
  #cont4 ul li p {
    margin-top: 1em;
    text-align: left;
  }
}

/* #cont5 */
#cont5 {
  background: url(../images/top/bg.png) repeat-x center top;
  background-size: 50px auto;
}
#cont5 h2 {
  margin-bottom: 60px;
}

@media screen and (max-width: 1024px) {
  #cont5 h2 {
    margin-bottom: 6%;
  }
  #cont5 div {
    width: 94%;
    height: 0;
    margin: auto;
    padding-top: 53%;
    position: relative;
  }
  #cont5 div iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
  }
}

@media screen and (max-width: 768px) {
  #cont5 {
    background: url(../images/top/bg.png) repeat-x center top;
    background-size: 9% auto;
  }
}

/* #cont6 */
#cont6 {
  background: url(../images/top/cont6_bg.png) center center;
  background-size: 90px auto;
}
#cont6 h2 {
  margin-bottom: 50px;
  color: #fff;
}
#cont6 ul {
  width: 90%;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
#cont6 ul li {
  width: 17.5%;
  width: 23.5%;
  margin-top: 3%;
}

@media screen and (max-width: 768px) {
  #cont6 h2 {
    margin-bottom: 3%;
  }
  #cont6 ul li {
    width: 30%;
    margin-top: 5%;
  }
}

/* #cont7 */
#cont7 {
  background: url(../images/top/cont7_bg.jpg) center center;
  background-size: cover;
}
#cont7 section {
  margin-top: 90px;
  background-color: rgba(255, 255, 255, 0.8);
  display: -webkit-flex;
  display: flex;
}
#cont7 section:nth-of-type(even) {
  -webkit-flex-direction: row-reverse;
  flex-direction: row-reverse;
}
#cont7 section div {
  width: 50%;
  margin-top: -3em;
  padding-left: 40px;
  text-align: left;
}
#cont7 section:nth-of-type(even) div {
  padding-left: 0;
  padding-right: 40px;
}
#cont7 section div h3 {
  width: 94%;
  margin-bottom: 0.5em;
  padding: 0.8em 0.8em 0.5em;
  line-height: 1.3;
  font-size: 30px;
  font-weight: 900;
  background-color: #ffdb32;
}
#cont7 section:nth-of-type(even) div h3 {
  float: right;
}
#cont7 section div h3 span {
  display: block;
  margin-top: 1em;
  font-size: 18px;
  text-align: center;
  line-height: 2;
  border-radius: 1em;
}
#cont7 section div p {
  line-height: 1.5;
  clear: both;
}
#cont7 section figure {
  width: 50%;
  padding: 40px;
}

@media screen and (max-width: 1024px) {
  #cont7 section {
    margin-top: 9%;
    display: block;
  }
  #cont7 section div {
    width: auto;
    margin-top: 0em;
    padding: 0 5% 5%;
  }
  #cont7 section:nth-of-type(even) div {
    padding: 0 5% 5%;
  }
  #cont7 section div h3 {
    max-width: 500px;
    width: 90%;
    margin: 0 auto -1em;
    padding: 0.8em 0.8em 0.5em;
    font-size: 30px;
    transform: translateY(-2em);
  }
  #cont7 section:nth-of-type(even) div h3 {
    float: none;
  }
  #cont7 section div h3 span {
    font-size: 18px;
  }
  #cont7 section figure.only_smart {
    display: block !important;
    width: auto;
    margin-bottom: 1em;
    padding: 0;
  }
  #cont7 section figure.only_pc {
    display: none !important;
  }
}

@media screen and (max-width: 768px) {
  #cont7 {
    background: url(../images/top/cont7_bg_s.jpg) center center;
    background-size: cover;
  }
  #cont7 section {
    margin-top: 18%;
  }
  #cont7 section div h3 {
    max-width: 100%;
    width: 100%;
    margin: 0 auto -1.2em;
    font-size: 5.5vw;
    transform: translateY(-2em);
  }
  #cont7 section div h3 span {
    margin-top: 0.5em;
    font-size: 3.4vw;
  }
}

/* #cont8 */
#cont8 {
}
#cont8 section {
  max-width: 770px;
  width: 94%;
  margin: 50px auto 0;
  font-weight: bold;
  text-align: left;
}

#cont8 #cont8_1 h3 {
  line-height: 2;
  font-size: 28px;
  text-align: center;
}
#cont8 #cont8_1 > div .line {
  padding: 0.5em 0;
  font-size: 24px;
  border-bottom: 1px solid;
}
#cont8 #cont8_1 > div .price {
  font-size: 35px;
}
#cont8 #cont8_1 > div .price .blue {
  line-height: 1.3;
  font-size: 87px;
}
#cont8 #cont8_1 > div .logo {
  padding: 1em 1em 1em 4.5em;
  background: #f0f9fd url(../images/icon_tit.png) no-repeat 1em center;
  background-size: 2.5em auto;
  font-size: 24px;
  text-align: left;
}
#cont8 #cont8_1 > div .caution {
  margin-top: 0.5em;
  display: block;
  font-size: 16px;
  font-weight: normal;
  text-align: right;
}

#cont8 #cont8_2 h3 {
  font-size: 28px;
}
#cont8 #cont8_2 .line {
  margin-bottom: 0.5em;
  padding-bottom: 0.5em;
  font-size: 20px;
  border-bottom: 1px solid;
}

@media screen and (max-width: 768px) {
  #cont8 section {
    margin: 9% auto 0;
  }
  #cont8 #cont8_1 {
    width: 100%;
  }
  #cont8 #cont8_1 h3 {
    font-size: 4.5vw;
  }
  #cont8 #cont8_1 > div {
    width: 94%;
    margin: 0 auto;
  }
  #cont8 #cont8_1 > div .line {
    padding-top: 1em;
    font-size: 4vw;
  }
  #cont8 #cont8_1 > div .price {
    line-height: 1;
    font-size: 6vw;
  }
  #cont8 #cont8_1 > div .price .blue {
    font-size: 14vw;
  }
  #cont8 #cont8_1 > div .price .small {
    display: block;
    font-size: 5vw;
  }
  #cont8 #cont8_1 > div .logo {
    margin-top: 1em;
    font-size: 3.8vw;
  }
  #cont8 #cont8_1 > div .caution {
    font-size: 3.4vw;
  }

  #cont8 #cont8_2 h3 {
    font-size: 4.2vw;
  }
  #cont8 #cont8_2 .line {
    font-size: 3.8vw;
  }
  #cont8 #cont8_2 ul {
    font-size: 3.4vw;
  }
}

/* #cont9 */
#cont9 {
  background-color: #f0f9fd;
}
#cont9 h2 {
  margin-bottom: 50px;
}
#cont9 .inner {
  max-width: 770px;
  padding: 1.5% 0;
  background-color: #fff;
}
#cont9 .inner div {
  padding: 1.5% 3%;
  font-weight: bold;
  text-align: left;
}
#cont9 .inner div dt {
  float: left;
}
#cont9 .inner div dd {
  padding-left: 9em;
}

@media screen and (max-width: 768px) {
  #cont9 h2 {
    margin-bottom: 5%;
  }
  #cont9 .inner div dt {
    float: none;
  }
  #cont9 .inner div dd {
    padding-left: 0;
  }
}
/*　　追加　　*/
.mv .mv-view{
	position: relative;
	background-image: url(../images/top/mv_bg.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	padding-top: 53px;
}
.mv .mv-view-inner{
	max-width: 1200px;
	width: 94%;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin: 0 auto;
}
.mv .mv-view .view-img{
	width: 78%;
}
.mv .mv-view .view-btn{
	width: 25%;
	margin-left: -3%;
}
.mv .mv-view .view-btn li + li{
	margin-top: 38px;
}
.mv .view-bottom{
	padding: 15px 0 90px 0;
}
.mv .view-bottom .view-bottom-inner{
	max-width: 900px;
	width: 94%;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin: 0 auto;
}
.mv .view-bottom .view-btn{
	display: none;
}
.mv .view-bottom-img{
	width: 35%;
}
.mv .view-box{
	width: 65%;
	text-align: left;
	padding-left: 40px;
}
.mv .view-box h2{
	color: #1C4366;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.45;
	margin-bottom: 14px;
}
.mv .view-box dl{
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	align-items: center;
	margin-bottom: 8px;
}
.mv .view-box dl dt{
	width: 121px;
}
.mv .view-box dl dd{
	width: calc(100% - 121px);
	color: #000000;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.45;
	padding-left: 6px;
}
.mv .view-box .p-text{
	color: #000000;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.45;
	margin-bottom: 8px;
}
.mv .view-box .p-text span{
	margin: 0 16px;
}
.mv .view-box .p-text:last-child{
	margin-bottom: 0;
}
.sp_br{
	display: none;
}
@media screen and (max-width:768px){
	.sp_br{
		display: block;
	}
	.mv .mv-view{
		background-image: url(../images/top/sp_mv_bg.jpg);
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
		padding-top: 10vw;
	}
	.mv .mv-view .view-img{
		width: 100%;
	}
	.mv .mv-view .view-btn{
		display: none;
	}
	.mv .view-bottom{
		padding: 5vw 0 8vw 0;
	}
	.mv .view-bottom .view-btn{
		display: flex;
		width: 100%;
		margin-bottom: 8vw;
	}
	.mv .view-bottom .view-btn li{
		width: 50%;
	}
	.mv .view-bottom-img{
		width: 100%;
		padding: 0 5vw;
        margin-bottom: 5vw;
	}
	.mv .view-box{
		width: 100%;
		padding-left: 0;
	}
	.mv .view-box h2{
		font-size: 4.6vw;
		text-align: center;
		margin-bottom: 3vw;
	}
	.mv .view-box dl{
		display: block;
		text-align: center;
		margin-bottom: 3vw;
	}
	.mv .view-box dl dt{
		width: 100%;
		margin-bottom: 1vw;
	}
	.mv .view-box dl dt img{
		width: 30vw;
	}
	.mv .view-box dl dd{
		width: 100%;
		font-size: 3.8vw;
		padding-left: 0;
	}
	.mv .view-box .p-text{
		font-size: 3vw;
		text-align: center;
		margin-bottom: 1vw;
	}
	.mv .view-box .p-text span{
		margin: 0 0.5vw;
	}
}