/*
	Theme Name: HTML5 Blank
	Theme URI: http://html5blank.com
	Description: HTML5 Blank WordPress Theme
	Version: 1.4.3
	Author: Todd Motto (@toddmotto)
	Author URI: http://toddmotto.com
	Tags: Blank, HTML5, CSS3

	License: MIT
	License URI: http://opensource.org/licenses/mit-license.php
*/

/*------------------------------------*\
    MAIN
\*------------------------------------*/

/********** aboutページcss 2020/08/31 **********/
.margin-1{margin: 1%;}
.margin-3{margin: 3%;}
.margin-5{margin: 5%;}
.padding-1{padding: 1%;}
.padding-3{padding: 3%;}
.padding-5{padding: 5%;}
.mt-3{margin-top: 3%;}
.mt-5{margin-top: 5%;}
.mb-1{margin-bottom: 1%;}
.mb-3{margin-bottom: 3%;}
.mb-5{margin-bottom: 5%;}
.pt-3{padding-top: 3%;}
.pt-5{padding-top: 5%;}
.pl-3{padding-left: 3%;}
.pl-5{padding-left: 5%;}
.pb-3{padding-bottom: 3%;}
.pb-5{padding-bottom: 5%;}
.bb-black{border-bottom: 1px solid #000;}
.bb-gray{border-bottom: 1px solid #D2D2D2;}
.font-size-14{font-size: 1.4rem;}
.font-size-16{font-size: 1.6rem;}
.font-size-20{font-size: 2rem;}
.font-size-23{font-size: 2.3rem;}
.bg-white{background-color: #fff;}
.bg-blue{background-color: #1F286F;}
.bg-gray{background-color: #F6F6F5;}
.tx-center{text-align: center;}
.tx-left{text-align: left;}
.color-f{color: #fff;}
.color-0{color: #000;}

.wrapper main{margin-top: 0;}
.section1-box{
  margin: 3%;
  color: #fff;
  text-align: center;
  padding: 1%;
}
.section1-text{
  font-size: 2.2rem;
  margin: 0 4%;
}
.no-2-top li:first-child{
  width: 53%;
}
.no-2-top li:nth-child(2){
  width: 47%;
  padding: 3%;
}
ul.vertical-box li:first-child{
  width: 20%;
}
ul.vertical-box li:nth-child(2){
  width: 60%;
  padding: 2%;
  text-align: left;
  padding-top: 0;
}
ul.vertical-box li:nth-child(3){
  width: 20%;
}
.no-3-flex{
  padding: 3%;
  padding-top: 0;
}
.no-3-flex li:first-child{
  width: 20%;
}
.no-3-flex li:nth-child(2){
  width: 5%;
}
.no-3-flex li:nth-child(3){
  width: 50%;
  font-size: 17px;
  padding: 3%;
}
.no-3-flex li:nth-child(4){
  width: 25%;
}
.no-3-flex.add{
  padding-bottom: 0;
}
.no-3-flex.add li:first-child{
  width: 23%;
  margin: 2%;
}
.no-3-flex.add li:nth-child(2){
  width: 70%;
  font-size: 17px;
  margin-top: 3%;
}
.arrow {
    position: relative;
    display: inline-block;
    padding-left: 20px;
}
.arrow::before {
    content: '';
    width: 20px;
    height: 20px;
    border: 0px;
    border-top: solid 2px #000;
    border-right: solid 2px #000;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 38%;
    left: 0;
    margin-top: -4px;
}
.no-4-box img.width-100{
  padding: 5% 0;
}
.no-6-txt{
  padding: 3% 7%;
}

.no-1.width-75{
  width: 85%;
}

.no-1.width-75 img{
  width: 100%;
}

.no-2 .width-75.auto,
.no-5 .width-75,
.no-6 .width-75{
  width: 85%;
}

.no-3.width-75,.no-4.width-75{
  width: 85%;
}

.no-6{
  width: 85%;
  margin: auto;
}

/********** SP **********/
@media screen and (max-width:480px) {
  .section1-box.font-size-16 {margin: 3% auto;padding: 2%;font-size: 15px;}
  .section1-text {margin: 0;font-size: 15px;}
  .flex.no-2-top{flex-wrap: wrap;}
  .no-2-top li:first-child {width: 100%;}
  .no-2-top li:nth-child(2) {width: 100%;padding: 7%;}
  .no-2 .font-size-23.bg-blue{font-size: 20px;padding: 3%;}
  .no-2 .vertical-box{flex-wrap: wrap;padding: 3% 0;}
  ul.vertical-box li:first-child {width: 20%;}
  ul.vertical-box li:nth-child(2) {width: 75%;padding-left: 3%;padding-top: 2%;}
  ul.vertical-box li:nth-child(2) p.tx-left{font-size: 18px;}
  ul.vertical-box li:nth-child(3) {width: 70%;padding-right: 3%;margin-top: 3%;}
  ul.vertical-box li:nth-child(3) p{font-size: 15px;}
  ul.vertical-box li:nth-child(4){width: 30%;margin-top: 3%;}
  .arrow-blue{width: 20%;}
  .no-3 .no-3-blue-box{font-size: 17px;padding: 2% 5%;}
  .no-3-big-txt{font-size: 18px;}
  .no-3-flex li:first-child {width: 50%;padding: 3% 0;}
  .no-3-flex li:first-child img {width: 90%;margin: 0 auto 7%;}
  .no-3-flex li:first-child p {font-size: 12px;}
  .no-3-flex li:nth-child(2) {width: 50%;padding-left: 3%;}
  .no-5-name{font-size: 20px;}
  .no-5-name-little{font-size: 12px;}
  .no-5-flex-02 li{margin-top: 5%;}

  .no-6{
    width: 100%;
  }




}