@charset "utf-8";


 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　サービス詳細 ここから　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　サービス詳細 ここから　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　サービス詳細 ここから　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.list-design {
    list-style: none;
    padding-top: 0px;
    padding-right: 30px;
    padding-left: 20px;
    position: relative;
    float: left;
    font-size: 115%;
    color: #333333;
    line-height: 28px;
    margin-top: -13px;
    margin-left: -20px;
}
.list-design li {
    border-bottom: 1px dashed #b9b9b9;
    margin-top: 10px;
    padding-top: 10px;
    padding-right: 0;
    padding-left: 35px;
    padding-bottom: 10px;
    width: 100%;
}
.list-design li:before {
    color: #5EBB00;
    content: "\f164";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    left : 20px;
    margin-right: 0;
    margin-left: 0;
    margin-bottom: 1px;
    position: absolute;
    font-size: 125%;
    margin-top: -2px;
}

.other {
    width: 100%;
    text-align: right;
    margin-top: 15px;
    float: right;
}


@media only screen and (max-width:650px) {
.service01_t	{
    height: auto;
    text-align: left;
    float: left;
    width: 100%;
    margin-bottom: 80px;
}
.service02_t	{
    height: auto;
    padding-top: 17px;
    padding-bottom: 15px;
    background-color: #DDDDDD;
    border-radius: 10px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 18px;
    padding-right: 18px;
    text-align: left;
    float: left;
    width: 90%;
    margin-bottom: 50px;
    color: #000000;
}

.service03_t	{
    width: 100%;
    float: left;
    height: auto;
    text-align: center;
    padding-top: 6px;
    padding-bottom: 4px;
    color: #FF5C26;
    font-weight: bold;
    font-size: 110%;
    margin-bottom: 10px;
    border-radius: 10px;
    background-color: #DDDDDD;
    line-height: 25px;
}
.icon	{
    width: 100%;
    float: left;
    margin-bottom: 80px;
}
}	
	
@media only screen and (min-width:650px)  and (max-width:851px){
.service01_t	{
    height: auto;
    text-align: left;
    float: left;
    width: 100%;
    color: #000000;
    margin-bottom: 80px;
}
.service02_t	{
    height: auto;
    padding-top: 17px;
    padding-bottom: 15px;
    background-color: #DDDDDD;
    border-radius: 10px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 18px;
    padding-right: 18px;
    text-align: left;
    float: left;
    width: 90%;
    margin-bottom: 50px;
    color: #000000;
}

.service03_t	{
    width: 100%;
    float: left;
    height: auto;
    text-align: center;
    padding-top: 6px;
    padding-bottom: 4px;
    color: #FF5C26;
    font-weight: bold;
    font-size: 110%;
    margin-bottom: 10px;
    border-radius: 10px;
    background-color: #DDDDDD;
    line-height: 25px;
}
.icon	{
    width: 100%;
    float: left;
    margin-bottom: 80px;
}
}	
	
@media only screen and (min-width:850px) {
.service01_t	{
    height: auto;
    padding-bottom: 15px;
    border-radius: 10px;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
    float: left;
    width: 100%;
    color: #000000;
}
.service02_t	{
    height: auto;
    padding-top: 17px;
    padding-bottom: 15px;
    background-color: #DDDDDD;
    border-radius: 10px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 18px;
    padding-right: 18px;
    text-align: left;
    float: left;
    width: 90%;
    margin-bottom: 50px;
    color: #000000;
}

.service03_t	{
    width: 257px;
    float: left;
    height: auto;
    text-align: center;
    padding-top: 6px;
    padding-bottom: 4px;
    color: #FF5C26;
    font-weight: bold;
    font-size: 110%;
    margin-bottom: 10px;
    border-radius: 10px;
    background-color: #DDDDDD;
    line-height: 25px;
    margin-right: 15px;
}
.icon	{
    width: 100%;
    float: left;
    margin-bottom: 50px;
}
}	
	
.service_text01 {
    width: 94%;
    float: left;
    line-height: 30px;
    background-repeat: no-repeat;
    background-position: left 6px;
    text-decoration: underline;
    font-size: 110%;
    margin-top: 7px;
}
.service_text02 {
    width: 94%;
    float: left;
    line-height: 25px;
    margin-bottom: 12px;
    font-size: 100%;
    margin-top: -2px;
}
.service_ex {
	width: 94%;
	float: left;
	line-height: 18px;
	margin-right: 1%;
	font-size: 75%;
	margin-top: 6px;
	margin-bottom: 6px;
}
.service_midashi01 {
	font-size: 140%;
	margin-bottom: 15px;
	padding-left: 25px;
	background-image: url(../images/p_orange.jpg);
	background-repeat: no-repeat;
	background-position: 0px 7px;
	margin-left: auto;
	margin-right: auto;
	width: auto;
	float: left;
	background-size: 20px auto;
}
.service_midashi02 {
    font-size: 140%;
    padding-left: 25px;
    background-image: url(../images/p_orange.jpg);
    background-repeat: no-repeat;
    background-position: 0px 4px;
    margin-left: auto;
    margin-right: auto;
    width: auto;
    float: left;
    background-size: 20px auto;
    padding-bottom: 5px;
}

 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　サービス詳細 ここまで　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　サービス詳細 ここまで　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　サービス詳細 ここまで　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */





.case{
    width: 100%;
    height: auto;
    font-size: 16px;
    line-height: 35px;
    text-align: left;
    padding-bottom: 10px;
    float: left;
    clear: left;
}
.se_txt {
    width: 100%;
    height: auto;
    float: right;
    font-size: 100%;
    margin-left: 0px;
    line-height: 28px;
}
.video{
    width: 560px;
    margin-left: 15%;
    margin-right: 15%;
    float: left;
}

@media only screen and (max-width:650px) {
.se_cata {
    width: 70%;
    height: auto;
    float: right;
    margin-left: 15%;
    margin-right: 15%;
}
.se_cata img{
    width: 100%;
    height: auto;
}
.se_hp {
    width: 70%;
    height: auto;
    border: 1px solid #CCCCCC;
    float: right;
    margin-left: 15%;
    margin-right: 15%;
    margin-bottom: 80px;
}
.se_hp img{
    width: 100%;
    height: auto;
}
}
@media only screen and (min-width:651px)  and (max-width:850px){
.se_cata {
    width: 46.5%;
    height: auto;
    float: right;
    margin-left: 10px;
}
.se_cata img{
    width: 100%;
    height: auto;
}
.se_hp {
    width: 46.5%;
    height: auto;
    border: 1px solid #CCCCCC;
    float: right;
    margin-left: 0px;
    margin-bottom: 80px;
}
.se_hp img{
    width: 100%;
    height: auto;
}
}	
	
@media only screen and (min-width:850px) {
.se_cata {
    width: 320px;
    height: auto;
    float: right;
    margin-right: 7%;
}
.se_cata img{
    width: 100%;
    height: auto;
}
.se_hp {
    width: 320px;
    height: auto;
    border: 1px solid #CCCCCC;
    float: left;
    margin-left: 7%;
}
.se_hp img{
    width: 100%;
    height: auto;
}
}

@media only screen and (max-width:850px) {
.tc01	{
    width: 88%;
    height: auto;
    padding-top: 22px;
    padding-bottom: 20px;
    background-color: #FFF0E2;
    border-radius: 8px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 23px;
    padding-right: 23px;
    text-align: center;
    float: left;
    margin-bottom: 30px;
    min-width: 0px;
}
.tc02	{
    width: 88%;
    height: auto;
    padding-top: 22px;
    background-color: #FFF0E2;
    border-radius: 8px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 23px;
    padding-right: 23px;
    text-align: center;
    float: left;
    margin-bottom: 80px;
    min-width: 0px;
    clear: left;
    padding-bottom: 5px;
}
.tc_title {
    text-align: left;
    font-size: 140%;
    padding-bottom: 0px;
    margin-bottom: 10px;
}
.tc_text01 {
    font-size: 95%;
    text-align: left;
}
.tc_text02 {
    text-align: left;
    font-size: 95%;
    margin-left: 20px;
}
}

@media only screen and (min-width:850px) {
.tc01	{
    width: 100%;
    height: auto;
    padding-top: 22px;
    padding-bottom: 20px;
    background-color: #FFF0E2;
    border-radius: 8px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 23px;
    padding-right: 23px;
    text-align: center;
    float: left;
    margin-bottom: 30px;
    min-width: 0px;
}
.tc02	{
    width: 100%;
    height: auto;
    padding-top: 22px;
    background-color: #FFF0E2;
    border-radius: 8px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 23px;
    padding-right: 23px;
    text-align: center;
    float: left;
    margin-bottom: 28px;
    min-width: 0px;
    clear: left;
    padding-bottom: 5px;
}
.tc_title {
    text-align: left;
    font-size: 140%;
    padding-bottom: 0px;
    margin-bottom: 10px;
}
.tc_text01 {
    font-size: 95%;
    text-align: left;
}
.tc_text02 {
    text-align: left;
    font-size: 95%;
    margin-left: 20px;
}
}
	

 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　ヒーロー ここから　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　ヒーロー ここから　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　ヒーロー ここから　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

@media only screen and (max-width:420px) {
.box_hero_s{
    width: 100%;
    float: left;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: -1;
    text-align: left;
    margin-top: 0px;
    margin-right: 0px;
    height: 36vh;
}
.page_tit {
    display: none;
}
.page_tit_s {
    font-size: 210%;
    font-family: 'Orbitron', sans-serif;
    color: #e95513;
    font-weight: 400;
    float: left;
    text-align: center;
    line-height: 60px;
    height: auto;
    width: 100%;
    margin-top: -185px;
}
}
@media only screen and (min-width:421px)  and (max-width:650px){
.box_hero_s{
    width: 100%;
    float: left;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: -1;
    text-align: left;
    margin-top: 0px;
    margin-right: 0px;
    height: 36vh;
}
.page_tit {
    display: none;
}
.page_tit_s {
    font-size: 210%;
    font-family: 'Orbitron', sans-serif;
    color: #e95513;
    font-weight: 400;
    float: left;
    text-align: center;
    line-height: 60px;
    height: auto;
    width: 100%;
    margin-top: -205px;
}
}

@media only screen and (min-width:651px)  and (max-width:850px){
.box_hero_s{
    width: 100%;
    float: left;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: -1;
    text-align: left;
    margin-top: 0px;
    margin-right: 0px;
    height: 60px;
}
.page_tit {
    font-size: 280%;
    font-family: 'Orbitron', sans-serif;
    color: #e95513;
    font-weight: 400;
    float: left;
    text-align: center;
    line-height: 60px;
    height: auto;
    width: 100%;
}
.page_tit_s {
    display: none;
}
}	
	
	
@media only screen and (min-width:850px) {
.box_hero_s{
    width: 100%;
    float: left;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: -1;
    text-align: left;
    margin-top: 0px;
    margin-right: 0px;
    height: 60px;
}
.page_tit {
    font-size: 210%;
    font-family: 'Orbitron', sans-serif;
    color: #e95513;
    font-weight: 400;
    float: left;
    text-align: left;
    line-height: 60px;
    height: auto;
    width: 100%;
    margin-left: 15px;
    margin-right: 15px;
    position: relative;
    top: 0px;
}
.page_tit_s {
    display: none;
}
}

 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　タイトル部分の背景 ここから　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

@keyframes move-stripe2 {
    0% {  background-position-x: 0;  }
    100% {  background-position-x: -34px;  }
}

@media only screen and (max-width:420px) {
.tit_bg_s {
    background: url("../images/01.png");
    animation: move-stripe2 1s infinite linear;
    float: left;
    width: 100%;
    margin-left: 0%;
    margin-top: 80px;
    margin-right: 0%;
    height: 200px;
}
}

@media only screen and (min-width:421px)  and (max-width:650px){
.tit_bg_s {
    background: url("../images/01.png");
    animation: move-stripe2 1s infinite linear;
    float: left;
    width: 100%;
    margin-left: 0%;
    margin-top: 80px;
    margin-right: 0%;
    height: 230px;
}
}

@media only screen and (min-width:651px)  and (max-width:850px){
.tit_bg_s {
    background: url("../images/01.png");
    animation: move-stripe2 1s infinite linear;
    float: left;
    width: 100%;
    margin-top: 70px;
    height: 60px;
}
}
@media only screen and (min-width:850px) {
.tit_bg_s {
    background: url("../images/01.png");
    animation: move-stripe2 1s infinite linear;
    float: left;
    width: auto;
    position: absolute;
    top: 13%;
}
}


 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　タイトル部分の背景 ここまで　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

@media only screen and (max-width:420px) {
button {
    cursor: pointer;
    font-weight: 700;
    font-family: 'Josefin Sans', sans-serif !important;
    letter-spacing: 1px;
    transition: all .2s;
    padding-top: 11px;
    padding-right: 10px;
    padding-left: 20px;
    padding-bottom: 6px;
    border-radius: 30px !important;
    background: #cfef00;
    border: 1px solid transparent;
    display: flex;
    align-items: center;
    font-size: 15px;
    margin-top: 20px !important;
}
}
@media only screen and (min-width:420px) {
button {
    cursor: pointer;
    font-weight: 700;
    font-family: 'Josefin Sans', sans-serif !important;
    letter-spacing: 1px;
    transition: all .2s;
    padding-top: 11px;
    padding-right: 10px;
    padding-left: 20px;
    padding-bottom: 6px;
    border-radius: 30px !important;
    background: #cfef00;
    border: 1px solid transparent;
    display: flex;
    align-items: center;
    font-size: 15px;
    margin-top: 45px !important;
}
}

button:hover {
    background: #c4e201;
    border-radius: 30px;
    margin-top: 30px;
}

button > svg {
    width: 50px;
    margin-left: 10px;
    transition: transform .3s ease-in-out;
    margin-top: -5px;
}

button:hover svg {
  transform: translateX(10px);
}

button:active {
  transform: scale(0.95);
}




 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　ヒーロー上 ここから　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　ヒーロー上 ここから　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　ヒーロー上 ここから　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

@media only screen and (max-width:420px) {
.box_in01{
    float: left;
    width: 100%;
    height: auto;
    top: 0px;
    margin-bottom: 80px;
}
.title_s {
    width: 100%;
    font-size: 240%;
    font-family: 'Philosopher', sans-serif;
    color: #555555;
    font-weight: 600;
    float: left;
    text-align: center;
    margin-top: -125px;
} 
.title_sub_s {
    width: 100%;
    font-size: 93%;
    text-align: center;
    color: #555555;
    letter-spacing: 0.5px;
    line-height: 20px;
    font-weight: bold;
    float: left;
    clear: left;
    margin-top: -55px;
}
.title {
    display: none;
} 
.title_sub {
    display: none;
}
.catchcopy{
    display: none;
}
.catchcopy_s{
    width: 100%;
    font-size: 120%;
    text-align: left;
    color: #e95513;
    letter-spacing: 3px;
    opacity: 1;
    line-height: 30px;
    font-weight: bold;
    float: left;
    clear: left;
    position: relative;
    top: 45%;
    margin-bottom: 20px;
}
.lead01{
    width: 100%;
    line-height: 30px;
    font-size: 105%;
    text-align: left;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
    float: left;
    font-weight: 500;
}
.contents_in_overwide_s{
    width: 90%;
    float: left;
    margin-left: 5%;
    padding-top: 0px;
    margin-top: 5%;
    margin-right: 5%;
    height: auto;
}
.box_service_ill01{
    width: 95%;
    height: auto;
    float: right;
    margin-right: 10px;
    margin-top: 10px;
}
.box_service_ill01 img{
    width: 100%;
    height: auto;
}
}

@media only screen and (min-width:421px)  and (max-width:651px){
.box_in01{
    float: left;
    width: 100%;
    height: auto;
    top: 0px;
    margin-bottom: 50px;
}
.title_s {
    width: 100%;
    font-size: 260%;
    font-family: 'Philosopher', sans-serif;
    color: #555555;
    font-weight: 600;
    float: left;
    text-align: center;
    margin-top: -145px;
} 
.title_sub_s {
    width: 100%;
    font-size: 100%;
    text-align: center;
    color: #555555;
    letter-spacing: 0.5px;
    line-height: 20px;
    font-weight: bold;
    float: left;
    clear: left;
    margin-top: -65px;
}
.title {
    display: none;
    margin-top: -80px;
} 
.title_sub {
    display: none;
}
.catchcopy{
    display: none;
}
.catchcopy_s{
    width: 100%;
    font-size: 120%;
    text-align: left;
    color: #e95513;
    letter-spacing: 3px;
    opacity: 1;
    line-height: 30px;
    font-weight: bold;
    float: left;
    clear: left;
    position: relative;
    top: 45%;
    margin-bottom: 20px;
}
.lead01{
    width: 100%;
    line-height: 30px;
    font-size: 105%;
    text-align: left;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
    float: left;
    font-weight: 500;
}
.contents_in_overwide_s{
    width: 90%;
    float: left;
    margin-left: 5%;
    padding-top: 0px;
    margin-top: 5%;
    margin-right: 5%;
    height: auto;
}
.box_service_ill01{
    width: 95%;
    height: auto;
    float: right;
    margin-right: 10px;
    margin-top: 10px;
}
.box_service_ill01 img{
    width: 100%;
    height: auto;
}
}

@media only screen and (min-width:651px)  and (max-width:850px){
.box_in01{
    float: left;
    width: 100%;
    height: 770px;
    margin-bottom: 70px;
}
.title_s {
    width: 100%;
    font-size: 320%;
    font-family: 'Philosopher', sans-serif;
    color: #555555;
    font-weight: 600;
    float: left;
    text-align: center;
} 
.title_sub_s {
    width: 100%;
    font-size: 100%;
    text-align: center;
    color: #555555;
    letter-spacing: 4px;
    line-height: 10px;
    font-weight: bold;
    float: left;
    clear: left;
}
.title {
    display: none;
} 
.title_sub {
    display: none;
}
.catchcopy{
    width: 100%;
    font-size: 120%;
    text-align: left;
    color: #e95513;
    letter-spacing: 3px;
    opacity: 1;
    line-height: 30px;
    font-weight: bold;
    float: left;
    clear: left;
    position: relative;
    top: 45%;
    margin-bottom: 20px;
}
.catchcopy_s{
    display: none;
}
.lead01{
    width: 100%;
    line-height: 30px;
    font-size: 105%;
    text-align: left;
    justify-content: center;
    align-items: center;
    margin-top: 50px;
    float: left;
    font-weight: 500;
}
.contents_in_overwide_s{
    width: 80%;
    float: left;
    margin-left: 10%;
    padding-top: 0px;
    margin-top: 5%;
    margin-right: 10%;
    height: auto;
}
.box_service_ill01{
    width: 45%;
    height: auto;
    float: right;
    margin-top: 10px;
}
.box_service_ill01 img{
    width: 100%;
    height: auto;
}
}
	
@media only screen and (min-width:851px)  and (max-width:1200px){
.box_in01{
    float: left;
    width: 100%;
    top: 20%;
    position: absolute;
    height: 670px;
}
.title_s {
    display: none;
} 
.title_sub_s {
    display: none;
}
.title{
    width: 100%;
    font-size: 380%;
    font-family: 'Philosopher', sans-serif;
    color: #555555;
    font-weight: 600;
    float: left;
    text-align: justify;
    position: absolute;
} 
.title_sub {
    width: 100%;
    font-size: 100%;
    text-align: left;
    color: #555555;
    letter-spacing: 8px;
    line-height: 10px;
    font-weight: bold;
    float: left;
    clear: left;
    top: 13%;
    position: absolute;
}
.catchcopy{
    width: 100%;
    font-size: 120%;
    text-align: left;
    color: #e95513;
    letter-spacing: 3px;
    opacity: 1;
    line-height: 30px;
    font-weight: bold;
    float: left;
    clear: left;
    position: relative;
    top: 45%;
    margin-bottom: 20px;
}
.catchcopy_s{
    display: none;
}
.lead01{
    width: 40%;
    line-height: 30px;
    font-size: 105%;
    text-align: left;
    float: left;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 18%;
    font-weight: 500;
}
.contents_in_overwide_s{
    width: 100%;
    float: left;
    margin-left: 0px;
    padding-left: 80px;
    padding-right: 80px;
    height: 90%;
    padding-top: 0px;
    margin-bottom: 5%;
    margin-top: 5%;
}
.box_service_ill01{
    width: 35%;
    height: auto;
    float: right;
    position: absolute;
    top: 16%;
    right: 18%;
    z-index: -1;
}
.box_service_ill01 img{
    width: 100%;
    height: auto;
}
}

@media only screen and (min-width:1201px)  and (max-width:1500px){
.box_in01{
    float: left;
    width: 100%;
    top: 25%;
    position: absolute;
    height: 670px;
}
.title_s {
    display: none;
} 
.title_sub_s {
    display: none;
}
.title {
    width: 100%;
    font-size: 380%;
    font-family: 'Philosopher', sans-serif;
    color: #555555;
    font-weight: 600;
    float: left;
    text-align: justify;
    position: absolute;
} 
.title_sub {
    width: 100%;
    font-size: 100%;
    text-align: left;
    color: #555555;
    letter-spacing: 8px;
    opacity: 1;
    line-height: 10px;
    font-weight: bold;
    float: left;
    clear: left;
    top: 13%;
    position: absolute;
}
.catchcopy{
    width: 100%;
    font-size: 120%;
    text-align: left;
    color: #e95513;
    letter-spacing: 3px;
    opacity: 1;
    line-height: 30px;
    font-weight: bold;
    float: left;
    clear: left;
    position: relative;
    top: 45%;
    margin-bottom: 20px;
}
.catchcopy_s{
    display: none;
}
.lead01{
    width: 35%;
    line-height: 30px;
    font-size: 105%;
    text-align: left;
    float: left;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 23%;
    font-weight: 500;
}
.contents_in_overwide_s{
    width: 100%;
    float: left;
    margin-left: 0px;
    padding-left: 80px;
    padding-right: 80px;
    height: 90%;
    padding-top: 0px;
    margin-bottom: 5%;
    margin-top: 5%;
}
.box_service_ill01{
    width: 30%;
    height: auto;
    float: right;
    position: absolute;
    top: 12%;
    right: 20%;
}
.box_service_ill01 img{
    width: 100%;
    height: auto;
}
}

@media only screen and (min-width:1501px) {
.box_in01{
    float: left;
    width: 100%;
    top: 25%;
    position: absolute;
    height: 670px;
    margin-left: 10px;
}
.title_s {
    display: none;
    margin-top: 0px;
} 
.title_sub_s {
    display: none;
}
.title {
    width: 100%;
    font-size: 380%;
    font-family: 'Philosopher', sans-serif;
    color: #555555;
    font-weight: 600;
    float: left;
    text-align: justify;
    position: absolute;
} 
.title_sub {
    width: 100%;
    font-size: 100%;
    text-align: left;
    color: #555555;
    letter-spacing: 3px;
    opacity: 1;
    line-height: 10px;
    font-weight: bold;
    float: left;
    clear: left;
    top: 14%;
    position: absolute;
}
.catchcopy{
    width: 100%;
    font-size: 120%;
    text-align: left;
    color: #e95513;
    letter-spacing: 3px;
    opacity: 1;
    line-height: 30px;
    font-weight: bold;
    float: left;
    clear: left;
    position: relative;
    top: 45%;
    margin-bottom: 20px;
}
.catchcopy_s{
    display: none;
}
.lead01{
    width: 35%;
    line-height: 30px;
    font-size: 105%;
    text-align: left;
    float: left;
    justify-content: center;
    align-items: center;
    position: relative;
    top: 23%;
    font-weight: 500;
}
.contents_in_overwide_s{
    width: 100%;
    float: left;
    margin-left: 0px;
    padding-left: 150px;
    padding-right: 150px;
    height: 90%;
    padding-top: 0px;
    margin-bottom: 5%;
    margin-top: 5%;
    clear: left;
}
.box_service_ill01{
    width: 24%;
    height: auto;
    float: right;
    position: absolute;
    top: 5%;
    right: 25%;
}
.box_service_ill01 img{
    width: 100%;
    height: auto;
}
}
 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　ヒーロー上 ここまで　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　ヒーロー上 ここまで　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　ヒーロー上 ここまで　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */











 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　納品までの流れ ここから　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　納品までの流れ ここから　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　納品までの流れ ここから　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
@media only screen and (max-width:420px) {
.yoko	{
    display: none;
}
.tate	{
    width: 90%;
    height: auto;
    float: left;
    padding-right: 0px;
    margin-top: 10px;
    margin-bottom: 70px;
    margin-left: 5%;
    margin-right: 5%;
}
.waku04_in	{
    width: 100%;
    height: auto;
    float: left;
}
.flow_waku_t {
    width: 100%;
    float: left;
    margin-bottom: 10px;
}
.flow_waku_b {
    width: 100%;
    float: left;
    margin-top: 10px;
}
.flow_waku_m01 {
    width: 100%;
    float: left;
}
.flow_waku_m02 {
    width: 100%;
    float: left;
}
.flow_waku_m03 {
    width: 100%;
    float: left;
}

.flow_txt_t {
    width: 73%;
    float: right;
    line-height: 25px;
    margin-top: 12px;
}
.flow_txt_b {
    width: 73%;
    float: right;
    line-height: 25px;
    margin-top: 12px;
}
.flow_tit {
    width: 100%;
    font-size: 130%;
    text-align: left;
    float: left;
    padding-bottom: 5px;
    font-family: "M PLUS Rounded 1c", sans-serif;
}
.circle_number {
    width: 50px;
    height: 50px;
    padding-top: 8px;
    border: 3px solid #e95513;
    border-radius: 50%;
    text-align: center;
    box-sizing: border-box;
    font-size: 130%;
    float: left;
    font-weight: bold;
    padding-left: 0px;
    padding-right: 1px;
    background-color: #FFFFFF;
    clear: left;
}
.b_line {
    width: 24px;
    height: 240px;
    float: left;
    clear: left;
    border-right: 3px solid #E95513;
    margin-top: -23px;
}
.c_line01 {
    height: 47px;
    float: left;
    width: 30px;
    border-top: 3px solid #e95513;
    margin-top: 23px;
}
.c_line02 {
    height: 47px;
    float: left;
    border-right: 3px solid #e95513;
    width: 258px;
    margin-right: 25px;
}
.flow_ill01 {
    width: 30%;
    height: auto;
    float: right;
    margin-left: 40%;
    margin-right: 30%;
    margin-bottom: -150px;
    margin-top: 50px;
}
.flow_ill01 img {
    width: 100%;
    height: auto;
}

.flow_ill02 {
    width: 50%;
    height: auto;
    float: right;
    margin-left: 30%;
    margin-right: 20%;
}
.flow_ill02 img {
    width: 100%;
    height: auto;
}
}


@media only screen and (min-width:421px)  and (max-width:651px){
.yoko	{
    display: none;
}
.tate	{
    width: 90%;
    height: auto;
    float: left;
    padding-right: 0px;
    margin-top: 20px;
    margin-left: 5%;
    margin-right: 5%;
}
.waku04_in	{
    width: 100%;
    height: auto;
    float: left;
}
.flow_waku_t {
    width: 100%;
    float: left;
    margin-bottom: 10px;
}
.flow_waku_b {
    width: 100%;
    float: left;
    margin-top: 10px;
}
.flow_waku_m01 {
    width: 100%;
    float: left;
}
.flow_waku_m02 {
    width: 100%;
    float: left;
}
.flow_waku_m03 {
    width: 100%;
    float: left;
}

.flow_txt_t {
    width: 72%;
    float: right;
    line-height: 25px;
    margin-top: 12px;
}
.flow_txt_b {
    width: 72%;
    float: right;
    line-height: 25px;
    margin-top: 12px;
}
.flow_tit {
    width: 100%;
    font-size: 140%;
    text-align: left;
    float: left;
    padding-bottom: 5px;
    font-family: "M PLUS Rounded 1c", sans-serif;
}
.circle_number {
    width: 50px;
    height: 50px;
    padding-top: 8px;
    border: 3px solid #e95513;
    border-radius: 50%;
    text-align: center;
    box-sizing: border-box;
    font-size: 130%;
    float: left;
    font-weight: bold;
    padding-left: 0px;
    padding-right: 1px;
    background-color: #FFFFFF;
    clear: left;
}
.b_line {
    width: 24px;
    height: 230px;
    float: left;
    clear: left;
    border-right: 3px solid #E95513;
    margin-top: -23px;
}
.c_line01 {
    height: 47px;
    float: left;
    width: 47px;
    border-top: 3px solid #e95513;
    margin-top: 23px;
}
.c_line01_1 {
    height: 47px;
    float: left;
    width: 47px;
    border-top: 3px solid #e95513;
    margin-top: 23px;
}
.c_line01_2 {
    height: 47px;
    float: left;
    width: 47px;
    border-top: 3px solid #e95513;
    margin-top: 23px;
}
.c_line02 {
    height: 47px;
    float: left;
    border-right: 3px solid #e95513;
    width: 258px;
    margin-right: 25px;
}
.flow_ill01 {
    width: 30%;
    height: auto;
    float: right;
    margin-left: 40%;
    margin-right: 30%;
    margin-bottom: -150px;
    margin-top: 50px;
}
.flow_ill01 img {
    width: 100%;
    height: auto;
}

.flow_ill02 {
    width: 50%;
    height: auto;
    float: right;
    margin-left: 30%;
    margin-right: 20%;
    margin-top: -50px;
}
.flow_ill02 img {
    width: 100%;
    height: auto;
}
}

@media only screen and (min-width:651px)  and (max-width:851px){
.yoko	{
    display: none;
}
.tate	{
    width: 80%;
    height: auto;
    float: left;
    padding-right: 0px;
    margin-top: 20px;
    margin-bottom: 70px;
    margin-left: 10%;
    margin-right: 10%;
}
.waku04_in	{
    width: 100%;
    height: auto;
    float: left;
}
.flow_waku_t {
    width: 100%;
    float: left;
    margin-bottom: 10px;
}
.flow_waku_b {
    width: 100%;
    float: left;
    margin-top: 10px;
}
.flow_waku_m01 {
    width: 100%;
    float: left;
}
.flow_waku_m02 {
    width: 100%;
    float: left;
}
.flow_waku_m03 {
    width: 100%;
    float: left;
}

.flow_txt_t {
    width: 80%;
    float: right;
    line-height: 25px;
    margin-top: 12px;
}
.flow_txt_b {
    width: 80%;
    float: right;
    line-height: 25px;
    margin-top: 12px;
}
.flow_tit {
    width: 100%;
    font-size: 140%;
    text-align: left;
    float: left;
    padding-bottom: 5px;
    font-family: "M PLUS Rounded 1c", sans-serif;
}
.circle_number {
    width: 50px;
    height: 50px;
    padding-top: 8px;
    border: 3px solid #e95513;
    border-radius: 50%;
    text-align: center;
    box-sizing: border-box;
    font-size: 130%;
    float: left;
    font-weight: bold;
    padding-left: 0px;
    padding-right: 1px;
    background-color: #FFFFFF;
    clear: left;
}
.b_line {
    width: 24px;
    height: 170px;
    float: left;
    clear: left;
    border-right: 3px solid #E95513;
    margin-top: -23px;
}
.c_line01 {
    height: 47px;
    float: left;
    width: 47px;
    border-top: 3px solid #e95513;
    margin-top: 23px;
}
.c_line02 {
    height: 47px;
    float: left;
    border-right: 3px solid #e95513;
    width: 258px;
    margin-right: 25px;
}
.flow_ill01 {
    width: 20%;
    height: auto;
    float: right;
    margin-left: 50%;
    margin-right: 30%;
    margin-bottom: -150px;
    margin-top: 50px;
}
.flow_ill01 img {
    width: 100%;
    height: auto;
}

.flow_ill02 {
    width: 40%;
    height: auto;
    float: right;
    margin-left: 35%;
    margin-right: 25%;
    margin-top: -40px;
}
.flow_ill02 img {
    width: 100%;
    height: auto;
}
}

@media only screen and (min-width:850px) {
.yoko	{
    width: 100%;
    height: auto;
    top: 18%;
    position: absolute;
    float: left;
    padding-right: 0px;
    margin-left: 50px;
}
.tate	{
    display: none;
}
.waku04_in	{
    width: 100%;
    height: auto;
    float: left;
    margin-left: 130px;
}
.flow_waku_t {
    width: 100%;
    float: left;
    margin-bottom: 10px;
}
.flow_waku_b {
    width: 100%;
    float: left;
    margin-top: 10px;
}
.flow_waku_m01 {
    width: 100%;
    float: left;
}
.flow_waku_m02 {
    width: 100%;
    float: left;
}
.flow_waku_m03 {
    width: 100%;
    float: left;
}

.flow_txt_t {
    width: 350px;
    float: left;
    margin-right: 130px;
    line-height: 25px;
    margin-left: 100px;
}
.flow_txt_b {
    width: 350px;
    float: left;
    line-height: 25px;
    margin-left: 430px;
    margin-right: -170px;
}
.flow_tit {
    width: 100%;
    font-size: 140%;
    text-align: left;
    float: left;
    padding-bottom: 5px;
    font-family: "M PLUS Rounded 1c", sans-serif;
}
.circle_number {
    width: 50px;
    height: 50px;
    padding-top: 8px;
    border: 3px solid #e95513;
    border-radius: 50%;
    text-align: center;
    box-sizing: border-box;
    font-size: 130%;
    float: left;
    font-weight: bold;
    padding-left: 0px;
    padding-right: 1px;
    background-color: #FFFFFF;
}
.b_line {
    width: 250px;
    height: 24px;
    float: left;
    border-bottom: 3px solid #e95513;
}
.c_line01 {
    height: 47px;
    float: left;
    border-right: 3px solid #e95513;
    width: 273px;
    margin-right: 324px;
}
.c_line02 {
    height: 47px;
    float: left;
    border-right: 3px solid #e95513;
    width: 258px;
    margin-right: 25px;
    margin-left: 315px;
}
.flow_ill01 {
    width: 100px;
    height: auto;
    position: absolute;
    top: 35%;
    float: right;
}
.flow_ill01 img {
    width: 100%;
    height: auto;
}

.flow_ill02 {
    width: 200px;
    height: auto;
    position: absolute;
    top: 20%;
    left: 82%;
}
.flow_ill02 img {
    width: 100%;
    height: auto;
}
}

.flow_txt_tsuika {
    width: 138px;
    height: 138px;
    border: 3px dashed #333333;
    position: absolute;
    z-index: 2;
    top: 65%;
    padding-top: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
    margin-left: 180px;
}	
 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　納品までの流れ ここまで　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　納品までの流れ ここまで　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　納品までの流れ ここまで　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */