@charset "utf-8";

img:not(.normal) {
 max-width:100%;
}

#rContainer {
 background-color: #FFF;
}


@media print, screen and (min-width: 768px) {
 #rContainer { font-size: 16px; }	
}
@media print, screen and (max-width: 767px) {
 #rContainer { font-size: 14px; }
}


#mainVisual {
 width: 1200px;
 max-width: 100%;
 margin: 0 auto;
}

@media print, screen and (max-width: 767px) {
 #mainVisual {  margin: 10px auto 0; }	
}


/*
基本のボックス
================================================== */
#agriInner {
 position: relative;
 margin-left: auto;
 margin-right: auto;
 background: url("../images/background.png") center center;
 overflow: hidden;
}
#agriInner p {
 text-align: left;
 line-height: 1.75;
}


@media print, screen and (min-width: 768px) {
 #agriInner { width: 1200px; max-width: 90%; padding: 60px 0; }	
}
@media print, screen and (max-width: 767px) {
 #agriInner { width: 100%; padding: 20px 0 30px; }
}

#agriInner:before {
 content: "";
 position: absolute;
 display: block;
 width: 100%;
 background-color: #FFF;
 z-index: 1;
}

@media print, screen and (min-width: 768px) {
 #agriInner:before { height: 685px; transform: skew(0deg,-18deg) translateY(-200px); }
}
@media print, screen and (max-width: 767px) {
 #agriInner:before { height: 450px; transform: skew(0deg,-18deg) translateY(-100px); }	
}


.agriBlock {
 display: block;
 position: relative;
 width: 1020px;
 max-width: calc(100% - 20px);
 margin-left: auto;
 margin-right: auto;
 z-index: 2;
}


@media print, screen and (min-width: 768px) {
.agriBlock { max-width: calc(100% - 20px);}	
.agriBlock + .agriBlock { margin-top: 80px;}
.agriBlock.notice { margin-top: 60px;}
}

@media print, screen and (max-width: 767px) {
.agriBlock { max-width: calc(100% - 40px);}	
 .agriBlock + .agriBlock { margin-top: 40px; }
 .agriBlock.notice { margin-top: 30px;}
}

/*
見出し
================================================== */
.agriBlock .headline:not(.blacks) {
 position: relative;
 display: table;
 margin: 0 auto;
 font-weight: bold;
 line-height: 1.75;
}
.agriBlock .headline:not(.blacks) span:not(.number) {
 position: relative;
 display: table;
 margin: 0 auto;
}

#agriInner .headline--sub {
 position: relative;
 display: table;
 margin: 0 auto;
 font-weight: bold;
}


#agriInner .headline .number { line-height: 1; }



@media print, screen and (min-width: 768px) {
 .agriBlock .headline:not(.blacks) { font-size: 32px; padding: 50px 60px 0; }
 .agriBlock .headline:not(.blacks):before {
 position: absolute;
 left: 0;
 top:0;
 content: "";
 width:5px;
 height: 105px;
 border-radius : 3px;
 background-color: #bc5353;
 transform: rotate(35deg) translateY(-24px) translateX(22px);
}	
#agriInner .headline--sub { font-size: 24px; line-height: 1.75; padding-bottom: .25em; background: url(../images/stripe.png) left bottom repeat-x; }	
#agriInner .headline .number { font-size: 70px; }
}

@media print, screen and (max-width: 767px) {
 .agriBlock .headline:not(.blacks) { font-size: 20px; padding: 10px 0px 0 10px; letter-spacing: -.05em; }
 .agriBlock .headline:not(.blacks) span:first-child:before {
 position: absolute;
 left: 0;
 top:0;
 content: "";
 width:3px;
 height: 36px;	
 border-radius : 3px;
 background-color: #bc5353;
 transform: rotate(35deg) translateY(0px) translateX(-20px);
}
#agriInner .headline--sub { font-size: 18px; line-height: 1.5; }
#agriInner .headline--sub span {
 display: table; margin: .5em auto 0; 
 padding-bottom: .25em; 
 background: url(../images/stripe.png) left bottom repeat-x;
 background-size: auto 6px;
 }
#agriInner .headline .number { font-size: 36px; }
}

/*
個別の体裁
============================================*/

#movieArea {
 position: relative;
 display: table;
 margin: 0 auto;
 border-radius : 3px;
 background-color: #FFF;
 width: 520px;
 box-sizing: border-box;
}
#movieArea .inner {
 position: relative;
 padding-top: 56.25%;
}
#movieArea iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


@media print, screen and (min-width: 768px) {
 #movieArea { padding : 6px; width: 520px; }	
}
@media print, screen and (max-width: 767px) {
 #movieArea { padding : 3px; width: 100%; }
}

/*
3つのメリット
============*/
.dogearList li {
 position: relative;
 min-height: 300px;
 background: linear-gradient(225deg, transparent 14px,#FFF 14px,#FFF 14px);
 border-left: solid 3px #000;
 border-bottom: solid 3px #000;
}
.dogearList > li > div {
 position: relative;
 width: 100%;
 height: 100%;
 box-sizing: border-box;
}
.dogearList > li > div:before {
 content: "";
 position: absolute;
 top: -3px;
 left: -3px;
 display: block;
 width: calc(100% - 19px);
 height: 3px;
 background-color: #000;
}
.dogearList > li > div:after {
 content: "";
 position: absolute;
 right: -3px;
 bottom: -3px;
 display: block;
 width: 3px;
 height: calc(100% - 19px);
 background-color: #000;
 z-index: 1;
}

.dogearList li:before {
 width: 36px;
 height: 36px;
 display: block;
 position: absolute;
 top: -3px;
 right: -3px;
 content: "";
 border-right: solid 3px #000;
 transform: rotate(-45deg) translate(-11px,2px);
 z-index: 2;
}
.dogearList li:after {
 width: 24px;
 height: 24px;
 display: block;
 position: absolute;
 z-index: 3;
 right: -2px;
 content: "";
 border-bottom: solid 3px rgb(0, 0, 0);
 border-left: solid 3px rgb(0, 0, 0);
 top: -2px;
}
.dogearList li:nth-child(1) .dogearListTitle { background: url("../images/headline01.png") top center no-repeat; }
.dogearList li:nth-child(2) .dogearListTitle { background: url("../images/headline02.png") top center no-repeat; }
.dogearList li:nth-child(3) .dogearListTitle { background: url("../images/headline03.png") top center no-repeat; }
.dogearListTitle {
 padding-top: 110px;
}

.dogearListTitle span{
 display: table;
 margin-left: auto;
 margin-right: auto;
 line-height: 1.4;
 padding-bottom: 6px;
}
.dogearListTitle span + span {
 margin-top: 10px;
}


@media print, screen and (min-width: 768px) {
.dogearList {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: 1fr;
grid-column-gap: 30px;
grid-row-gap: 0px;
}	
.dogearList > li > div { padding: 35px 20px; }
.dogearListTitle span { font-size: 24px; background: url(../images/stripe.png) left bottom repeat-x; }
}
@media print, screen and (max-width: 767px) {
.dogearList {
 margin: 20px auto 0;
 max-width: 75%;
}
.dogearList > li:not(:first-child) { margin-top: 20px; }
.dogearList > li > div { padding: 35px 20px; }
.dogearListTitle span { font-size: 18px;  background: url(../images/stripe.png) left bottom repeat-x; background-size: auto 6px; }
}



/*
CVボタン
============*/
.contactButton {
 position: relative;
 margin: 50px auto 0;
 max-width: 960px;
 text-decoration: none !important;
 padding: 10px 30px;
 text-align: left;
 box-sizing: border-box;
 display: flex;
 justify-content: center;
 box-shadow: 8px 12px 0px 0 rgb(000, 000, 000,0.2);
}
.contactButton span {
 position: relative;
 margin: 0 auto;
 color: #FFF;
 line-height: 1.4;
 display: flex;
 align-items: center;
}
.contactButton span:before {
 position: absolute;
 left: 0;
 top:50%;
 transform: translateY(-50%);
 content: "";
 display: block;
 border-radius : 50%;
}

@media print, screen and (min-width: 768px){
.contactButton {
 margin: 50px auto 0;
 width: calc(100% - 60px);
 max-width: 960px;
 padding: 10px 30px;
 background: url("../images/arw.png") right 35px center #bc5353 no-repeat;
 box-shadow: 8px 12px 0px 0 rgb(000, 000, 000,0.2);
}
.contactButton span {
 padding-left: 155px;
 min-height: 124px;
 font-size: 34px;
}
.contactButton span:before {
 width: 124px;
 height: 124px;
 background: url(../images/megaphone.png) center center #FFF no-repeat;
}
}
@media print, screen and (max-width: 767px){
.contactButton {
 margin: 25px auto 0;
 width: calc(100% - 10px);
 max-width: 90%;
 padding: 10px 30px 10px 15px;
 background: #bc5353;
 box-shadow: 4px 6px 0px 0 rgb(000, 000, 000,0.2);
}
.contactButton span {
 padding-left: 70px;
 min-height: 60px;
 font-size: 16px;
}
.contactButton span:before {
 width: 60px;
 height: 60px;
 background: url(../images/megaphone.png) center center #FFF no-repeat;
 background-size: 50% auto;
}
 .contactButton:after {
  content: "";
  position: absolute;
  right: 1em;
  top:50%;
  transform: translateY(-50%) rotate(45deg);
  display: block;
  width: .5em;
  height: .5em;
  border-top: solid 2px#FFF;
  border-right: solid 2px#FFF;
 }	
	
	
}


/*
イラスト
============*/
.illustList { margin: 0 auto; }
.illustList li:not(:last-child):before , .illustList li:not(:last-child):after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: block;
}

@media print, screen and (min-width: 768px) {
.illustList { width: 700px; }
.illustList li:not(:last-child) { 
 position: relative;
 padding-bottom: 80px;
 }
 .illustList li:before {
  bottom:45px;
  width: 40px;
  height: 20px;
  background-color: #6aa1bd;
 }
 .illustList li:after {
  bottom:20px;
  width: 0;
  height: 0;
  border-left: 40px solid transparent;
  border-right: 40px solid transparent;
  border-top: 25px solid #6aa1bd;
 }
}
@media print, screen and (max-width: 767px) {
.illustList { width: 100%; }
.illustList li:not(:last-child) { 
 position: relative;
 padding-bottom: 40px;
 }
 .illustList li:before {
  bottom:18px;
  width: 20px;
  height: 10px;
  background-color: #6aa1bd;
 }
 .illustList li:after {
  bottom:8px;
  width: 0;
  height: 0;
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  border-top: 12px solid #6aa1bd;
 }
}

/*
吹き出し
============*/
.fukidashi {
 position: relative;
 background-color: #FFF;
}
.fukidashi:before {
 content: "";
 position:absolute;
 top:0;
 left: 50%;
 transform: translate( -50% , -50%) rotate(45deg);
 display: block;
 width: 43px;
 height: 43px;
 background-color: #FFF;
 z-index: 1;
}
.fukidashi span{
 position: relative;
 z-index: 2;
}

@media print, screen and (min-width: 768px) {
 .fukidashi { padding: 30px; margin-top: 60px; border-radius : 10px; }
 .fukidashi:before { width: 43px; height: 43px; }
}
@media print, screen and (max-width: 767px) {
 .fukidashi { padding: 15px; margin-top: 30px; border-radius : 5px; }
 .fukidashi:before { width: 21px; height: 21px; }
}


/*
SDGs達成に貢献
============*/

.bg-sky {
 background: url(../images/sky.jpg) center bottom #FFF no-repeat;
 background-size: cover;
 box-sizing: border-box;
}
.bg-sky .inner {
 position: relative;
 background-color:rgba(255,255,255,0.8);
 padding: 35px 40px 80px;
 box-sizing: border-box;
}

.sdgsList {
 border-collapse: collapse; 
 border-spacing: 0; 
 box-sizing: border-box;
 width: 100%;
}

.sdgsList td {
 background-color: #FFF;
 text-align: left;
 font-weight: bold;
 color: #568a4d;
 line-height: 1;
 box-sizing:border-box;
  border: solid 1px #cfcfcf;
}

@media print, screen and (min-width: 768px) {
 .bg-sky { position: relative; width: 100%; padding: 95px 80px; }
 .bg-sky .inner { padding: 35px 40px 80px; }
 .sdgsList td {
  padding: 25px 20px 20px;
  width: 50%;
  font-size: 22px;
 }
}
@media print, screen and (max-width: 767px) {
 .bg-sky { position: relative; margin: 0 calc(50% - 50vw); width: 100vw; max-width: none; padding: 20px; }
 .bg-sky .inner { padding: 25px 20px 20px; }
 .sdgsList td {
  display: block;
  padding: 15px;
  width: 100%;
  font-size: 14px;
 }
 .sdgsList td:first-child { border-bottom: none; }
}


/*
注意点
============*/
.headline.blacks {
 position: relative;
 background-color: #333333;
 color: #FFF;
 font-size: 24px;
 padding: 1rem;
 border-radius : 10px;
 line-height: 1;
}
.agriBlock.notice > ul > li {
 position: relative;
 margin-top: 1.5em;
 padding-left: 1.25em;
 line-height: 1.5;
 text-align: left;
}
.agriBlock.notice > ul > li:before {
 position: absolute;
 left: 0;
 top:0;
 content: "・";
}

@media print, screen and (min-width: 768px) {
.headline.blacks { font-size: 24px; padding: 1rem; border-radius : 10px; }
.agriBlock.notice ul { margin-top: 40px; }
}
@media print, screen and (max-width: 767px) {
.headline.blacks { font-size: 18px; padding: .75em .5em .5em; border-radius : 5px; }
.agriBlock.notice ul { margin-top: 20px; }
}



/*
よくある質問
============*/
.agriBlock.faq dl {
 margin: 40px auto 0;
 text-align: left;
 width: calc(100% - 60px);
}

.agriBlock.faq dt {
 position: relative;
 text-align: left;
 font-weight: bold;
}

.agriBlock.faq dt:before , .agriBlock.faq dd:before {
 position: absolute;
 top:0;
 left:0;
 color: #FFF;
 font-weight: bold;
 text-align: center;
 display: block;
 border-radius : 50%;
}
.agriBlock.faq dd {
 position: relative;
 text-align: left;
 line-height: 1.5;
}

.agriBlock.faq dt:before { content: "Q"; background-color: #bf5e5e; }
.agriBlock.faq dd:before { content: "A"; background-color: #6aa1bd; }


@media print, screen and (min-width: 768px) {
.agriBlock.faq dl { margin: 40px auto 0; width: calc(100% - 60px); }
.agriBlock.faq dt { margin-top: 30px; font-size: 22px; padding-left: 70px; min-height: 52px; padding-top: 12px; }
.agriBlock.faq dt:before , .agriBlock.faq dd:before { width: 52px; height: 52px; font-size: 28px; line-height: 52px;}
.agriBlock.faq dd { margin-top: 15px; padding-left: 70px; min-height: 52px; padding-top: 16px; }

}
@media print, screen and (max-width: 767px) {
.agriBlock.faq dl { margin: 30px auto 0; width: 100%; }
.agriBlock.faq dt { margin-top: 25px; font-size: 16px; padding-left: 35px; min-height: 26px; padding-top: 6px; }
.agriBlock.faq dt:before , .agriBlock.faq dd:before { width: 26px; height: 26px; font-size: 14px; line-height: 26px;}
.agriBlock.faq dd { margin-top: 10px; padding-left: 35px; min-height: 26px; padding-top: 4px; }
}










/* ------------------------------------------------- *
 *        margin & padding
 * ------------------------------------------------- */
.u-mt0 {
  margin-top: 0px !important;
}

@media screen and (min-width: 1200px) {
  .u-mt0-pc {
    margin-top: 0px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mt0-tb {
    margin-top: 0px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mt0-sp {
    margin-top: 0px !important;
  }
}

.u-pt0 {
  padding-top: 0px !important;
}

@media screen and (min-width: 1200px) {
  .u-pt0-pc {
    padding-top: 0px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pt0-tb {
    padding-top: 0px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pt0-sp {
    padding-top: 0px !important;
  }
}

.u-mt5 {
  margin-top: 5px !important;
}

@media screen and (min-width: 1200px) {
  .u-mt5-pc {
    margin-top: 5px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mt5-tb {
    margin-top: 5px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mt5-sp {
    margin-top: 5px !important;
  }
}

.u-pt5 {
  padding-top: 5px !important;
}

@media screen and (min-width: 1200px) {
  .u-pt5-pc {
    padding-top: 5px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pt5-tb {
    padding-top: 5px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pt5-sp {
    padding-top: 5px !important;
  }
}

.u-mt10 {
  margin-top: 10px !important;
}

@media screen and (min-width: 1200px) {
  .u-mt10-pc {
    margin-top: 10px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mt10-tb {
    margin-top: 10px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mt10-sp {
    margin-top: 10px !important;
  }
}

.u-pt10 {
  padding-top: 10px !important;
}

@media screen and (min-width: 1200px) {
  .u-pt10-pc {
    padding-top: 10px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pt10-tb {
    padding-top: 10px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pt10-sp {
    padding-top: 10px !important;
  }
}

.u-mt15 {
  margin-top: 15px !important;
}

@media screen and (min-width: 1200px) {
  .u-mt15-pc {
    margin-top: 15px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mt15-tb {
    margin-top: 15px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mt15-sp {
    margin-top: 15px !important;
  }
}

.u-pt15 {
  padding-top: 15px !important;
}

@media screen and (min-width: 1200px) {
  .u-pt15-pc {
    padding-top: 15px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pt15-tb {
    padding-top: 15px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pt15-sp {
    padding-top: 15px !important;
  }
}

.u-mt20 {
  margin-top: 20px !important;
}

@media screen and (min-width: 1200px) {
  .u-mt20-pc {
    margin-top: 20px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mt20-tb {
    margin-top: 20px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mt20-sp {
    margin-top: 20px !important;
  }
}

.u-pt20 {
  padding-top: 20px !important;
}

@media screen and (min-width: 1200px) {
  .u-pt20-pc {
    padding-top: 20px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pt20-tb {
    padding-top: 20px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pt20-sp {
    padding-top: 20px !important;
  }
}

.u-mt25 {
  margin-top: 25px !important;
}

@media screen and (min-width: 1200px) {
  .u-mt25-pc {
    margin-top: 25px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mt25-tb {
    margin-top: 25px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mt25-sp {
    margin-top: 25px !important;
  }
}

.u-pt25 {
  padding-top: 25px !important;
}

@media screen and (min-width: 1200px) {
  .u-pt25-pc {
    padding-top: 25px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pt25-tb {
    padding-top: 25px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pt25-sp {
    padding-top: 25px !important;
  }
}

.u-mt30 {
  margin-top: 30px !important;
}

@media screen and (min-width: 1200px) {
  .u-mt30-pc {
    margin-top: 30px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mt30-tb {
    margin-top: 30px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mt30-sp {
    margin-top: 30px !important;
  }
}

.u-pt30 {
  padding-top: 30px !important;
}

@media screen and (min-width: 1200px) {
  .u-pt30-pc {
    padding-top: 30px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pt30-tb {
    padding-top: 30px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pt30-sp {
    padding-top: 30px !important;
  }
}

.u-mt35 {
  margin-top: 35px !important;
}

@media screen and (min-width: 1200px) {
  .u-mt35-pc {
    margin-top: 35px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mt35-tb {
    margin-top: 35px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mt35-sp {
    margin-top: 35px !important;
  }
}

.u-pt35 {
  padding-top: 35px !important;
}

@media screen and (min-width: 1200px) {
  .u-pt35-pc {
    padding-top: 35px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pt35-tb {
    padding-top: 35px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pt35-sp {
    padding-top: 35px !important;
  }
}

.u-mt40 {
  margin-top: 40px !important;
}

@media screen and (min-width: 1200px) {
  .u-mt40-pc {
    margin-top: 40px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mt40-tb {
    margin-top: 40px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mt40-sp {
    margin-top: 40px !important;
  }
}

.u-pt40 {
  padding-top: 40px !important;
}

@media screen and (min-width: 1200px) {
  .u-pt40-pc {
    padding-top: 40px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pt40-tb {
    padding-top: 40px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pt40-sp {
    padding-top: 40px !important;
  }
}

.u-mt45 {
  margin-top: 45px !important;
}

@media screen and (min-width: 1200px) {
  .u-mt45-pc {
    margin-top: 45px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mt45-tb {
    margin-top: 45px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mt45-sp {
    margin-top: 45px !important;
  }
}

.u-pt45 {
  padding-top: 45px !important;
}

@media screen and (min-width: 1200px) {
  .u-pt45-pc {
    padding-top: 45px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pt45-tb {
    padding-top: 45px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pt45-sp {
    padding-top: 45px !important;
  }
}

.u-mt50 {
  margin-top: 50px !important;
}

@media screen and (min-width: 1200px) {
  .u-mt50-pc {
    margin-top: 50px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mt50-tb {
    margin-top: 50px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mt50-sp {
    margin-top: 50px !important;
  }
}

.u-pt50 {
  padding-top: 50px !important;
}

@media screen and (min-width: 1200px) {
  .u-pt50-pc {
    padding-top: 50px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pt50-tb {
    padding-top: 50px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pt50-sp {
    padding-top: 50px !important;
  }
}

.u-mt55 {
  margin-top: 55px !important;
}

@media screen and (min-width: 1200px) {
  .u-mt55-pc {
    margin-top: 55px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mt55-tb {
    margin-top: 55px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mt55-sp {
    margin-top: 55px !important;
  }
}

.u-pt55 {
  padding-top: 55px !important;
}

@media screen and (min-width: 1200px) {
  .u-pt55-pc {
    padding-top: 55px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pt55-tb {
    padding-top: 55px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pt55-sp {
    padding-top: 55px !important;
  }
}

.u-mt60 {
  margin-top: 60px !important;
}

@media screen and (min-width: 1200px) {
  .u-mt60-pc {
    margin-top: 60px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mt60-tb {
    margin-top: 60px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mt60-sp {
    margin-top: 60px !important;
  }
}

.u-pt60 {
  padding-top: 60px !important;
}

@media screen and (min-width: 1200px) {
  .u-pt60-pc {
    padding-top: 60px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pt60-tb {
    padding-top: 60px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pt60-sp {
    padding-top: 60px !important;
  }
}

.u-mr0 {
  margin-right: 0px !important;
}

@media screen and (min-width: 1200px) {
  .u-mr0-pc {
    margin-right: 0px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mr0-tb {
    margin-right: 0px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mr0-sp {
    margin-right: 0px !important;
  }
}

.u-pr0 {
  padding-right: 0px !important;
}

@media screen and (min-width: 1200px) {
  .u-pr0-pc {
    padding-right: 0px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pr0-tb {
    padding-right: 0px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pr0-sp {
    padding-right: 0px !important;
  }
}

.u-mr5 {
  margin-right: 5px !important;
}

@media screen and (min-width: 1200px) {
  .u-mr5-pc {
    margin-right: 5px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mr5-tb {
    margin-right: 5px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mr5-sp {
    margin-right: 5px !important;
  }
}

.u-pr5 {
  padding-right: 5px !important;
}

@media screen and (min-width: 1200px) {
  .u-pr5-pc {
    padding-right: 5px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pr5-tb {
    padding-right: 5px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pr5-sp {
    padding-right: 5px !important;
  }
}

.u-mr10 {
  margin-right: 10px !important;
}

@media screen and (min-width: 1200px) {
  .u-mr10-pc {
    margin-right: 10px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mr10-tb {
    margin-right: 10px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mr10-sp {
    margin-right: 10px !important;
  }
}

.u-pr10 {
  padding-right: 10px !important;
}

@media screen and (min-width: 1200px) {
  .u-pr10-pc {
    padding-right: 10px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pr10-tb {
    padding-right: 10px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pr10-sp {
    padding-right: 10px !important;
  }
}

.u-mr15 {
  margin-right: 15px !important;
}

@media screen and (min-width: 1200px) {
  .u-mr15-pc {
    margin-right: 15px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mr15-tb {
    margin-right: 15px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mr15-sp {
    margin-right: 15px !important;
  }
}

.u-pr15 {
  padding-right: 15px !important;
}

@media screen and (min-width: 1200px) {
  .u-pr15-pc {
    padding-right: 15px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pr15-tb {
    padding-right: 15px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pr15-sp {
    padding-right: 15px !important;
  }
}

.u-mr20 {
  margin-right: 20px !important;
}

@media screen and (min-width: 1200px) {
  .u-mr20-pc {
    margin-right: 20px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mr20-tb {
    margin-right: 20px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mr20-sp {
    margin-right: 20px !important;
  }
}

.u-pr20 {
  padding-right: 20px !important;
}

@media screen and (min-width: 1200px) {
  .u-pr20-pc {
    padding-right: 20px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pr20-tb {
    padding-right: 20px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pr20-sp {
    padding-right: 20px !important;
  }
}

.u-mr25 {
  margin-right: 25px !important;
}

@media screen and (min-width: 1200px) {
  .u-mr25-pc {
    margin-right: 25px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mr25-tb {
    margin-right: 25px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mr25-sp {
    margin-right: 25px !important;
  }
}

.u-pr25 {
  padding-right: 25px !important;
}

@media screen and (min-width: 1200px) {
  .u-pr25-pc {
    padding-right: 25px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pr25-tb {
    padding-right: 25px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pr25-sp {
    padding-right: 25px !important;
  }
}

.u-mr30 {
  margin-right: 30px !important;
}

@media screen and (min-width: 1200px) {
  .u-mr30-pc {
    margin-right: 30px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mr30-tb {
    margin-right: 30px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mr30-sp {
    margin-right: 30px !important;
  }
}

.u-pr30 {
  padding-right: 30px !important;
}

@media screen and (min-width: 1200px) {
  .u-pr30-pc {
    padding-right: 30px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pr30-tb {
    padding-right: 30px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pr30-sp {
    padding-right: 30px !important;
  }
}

.u-mr35 {
  margin-right: 35px !important;
}

@media screen and (min-width: 1200px) {
  .u-mr35-pc {
    margin-right: 35px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mr35-tb {
    margin-right: 35px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mr35-sp {
    margin-right: 35px !important;
  }
}

.u-pr35 {
  padding-right: 35px !important;
}

@media screen and (min-width: 1200px) {
  .u-pr35-pc {
    padding-right: 35px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pr35-tb {
    padding-right: 35px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pr35-sp {
    padding-right: 35px !important;
  }
}

.u-mr40 {
  margin-right: 40px !important;
}

@media screen and (min-width: 1200px) {
  .u-mr40-pc {
    margin-right: 40px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mr40-tb {
    margin-right: 40px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mr40-sp {
    margin-right: 40px !important;
  }
}

.u-pr40 {
  padding-right: 40px !important;
}


@media screen and (min-width: 1200px) {
  .u-pr40-pc {
    padding-right: 40px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pr40-tb {
    padding-right: 40px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pr40-sp {
    padding-right: 40px !important;
  }
}

.u-mr45 {
  margin-right: 45px !important;
}

@media screen and (min-width: 1200px) {
  .u-mr45-pc {
    margin-right: 45px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mr45-tb {
    margin-right: 45px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mr45-sp {
    margin-right: 45px !important;
  }
}

.u-pr45 {
  padding-right: 45px !important;
}

@media screen and (min-width: 1200px) {
  .u-pr45-pc {
    padding-right: 45px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pr45-tb {
    padding-right: 45px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pr45-sp {
    padding-right: 45px !important;
  }
}

.u-mr50 {
  margin-right: 50px !important;
}

@media screen and (min-width: 1200px) {
  .u-mr50-pc {
    margin-right: 50px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mr50-tb {
    margin-right: 50px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mr50-sp {
    margin-right: 50px !important;
  }
}

.u-pr50 {
  padding-right: 50px !important;
}

@media screen and (min-width: 1200px) {
  .u-pr50-pc {
    padding-right: 50px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pr50-tb {
    padding-right: 50px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pr50-sp {
    padding-right: 50px !important;
  }
}

.u-mr55 {
  margin-right: 55px !important;
}

@media screen and (min-width: 1200px) {
  .u-mr55-pc {
    margin-right: 55px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mr55-tb {
    margin-right: 55px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mr55-sp {
    margin-right: 55px !important;
  }
}

.u-pr55 {
  padding-right: 55px !important;
}

@media screen and (min-width: 1200px) {
  .u-pr55-pc {
    padding-right: 55px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pr55-tb {
    padding-right: 55px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pr55-sp {
    padding-right: 55px !important;
  }
}

.u-mr60 {
  margin-right: 60px !important;
}

@media screen and (min-width: 1200px) {
  .u-mr60-pc {
    margin-right: 60px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mr60-tb {
    margin-right: 60px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mr60-sp {
    margin-right: 60px !important;
  }
}

.u-pr60 {
  padding-right: 60px !important;
}

@media screen and (min-width: 1200px) {
  .u-pr60-pc {
    padding-right: 60px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pr60-tb {
    padding-right: 60px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pr60-sp {
    padding-right: 60px !important;
  }
}

.u-mb0 {
  margin-bottom: 0px !important;
}

@media screen and (min-width: 1200px) {
  .u-mb0-pc {
    margin-bottom: 0px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mb0-tb {
    margin-bottom: 0px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mb0-sp {
    margin-bottom: 0px !important;
  }
}

.u-pb0 {
  padding-bottom: 0px !important;
}

@media screen and (min-width: 1200px) {
  .u-pb0-pc {
    padding-bottom: 0px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pb0-tb {
    padding-bottom: 0px !important;
  }
}

@media screen and (max-width: 767px) {

  .u-pb0-sp {
    padding-bottom: 0px !important;
  }
}

.u-mb5 {
  margin-bottom: 5px !important;
}

@media screen and (min-width: 1200px) {
  .u-mb5-pc {
    margin-bottom: 5px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mb5-tb {
    margin-bottom: 5px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mb5-sp {
    margin-bottom: 5px !important;
  }
}

.u-pb5 {
  padding-bottom: 5px !important;
}

@media screen and (min-width: 1200px) {
  .u-pb5-pc {
    padding-bottom: 5px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pb5-tb {
    padding-bottom: 5px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pb5-sp {
    padding-bottom: 5px !important;
  }
}

.u-mb10 {
  margin-bottom: 10px !important;
}

@media screen and (min-width: 1200px) {
  .u-mb10-pc {
    margin-bottom: 10px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mb10-tb {
    margin-bottom: 10px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mb10-sp {
    margin-bottom: 10px !important;
  }
}

.u-pb10 {
  padding-bottom: 10px !important;
}

@media screen and (min-width: 1200px) {
  .u-pb10-pc {
    padding-bottom: 10px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pb10-tb {
    padding-bottom: 10px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pb10-sp {
    padding-bottom: 10px !important;
  }
}

.u-mb15 {
  margin-bottom: 15px !important;
}

@media screen and (min-width: 1200px) {
  .u-mb15-pc {
    margin-bottom: 15px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mb15-tb {
    margin-bottom: 15px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mb15-sp {
    margin-bottom: 15px !important;
  }
}

.u-pb15 {
  padding-bottom: 15px !important;
}

@media screen and (min-width: 1200px) {
  .u-pb15-pc {
    padding-bottom: 15px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pb15-tb {
    padding-bottom: 15px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pb15-sp {
    padding-bottom: 15px !important;
  }
}

.u-mb20 {
  margin-bottom: 20px !important;
}

@media screen and (min-width: 1200px) {
  .u-mb20-pc {
    margin-bottom: 20px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mb20-tb {
    margin-bottom: 20px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mb20-sp {
    margin-bottom: 20px !important;
  }
}

.u-pb20 {
  padding-bottom: 20px !important;
}

@media screen and (min-width: 1200px) {
  .u-pb20-pc {
    padding-bottom: 20px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pb20-tb {
    padding-bottom: 20px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pb20-sp {
    padding-bottom: 20px !important;
  }
}

.u-mb25 {
  margin-bottom: 25px !important;
}

@media screen and (min-width: 1200px) {
  .u-mb25-pc {
    margin-bottom: 25px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mb25-tb {
    margin-bottom: 25px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mb25-sp {
    margin-bottom: 25px !important;
  }
}

.u-pb25 {
  padding-bottom: 25px !important;
}

@media screen and (min-width: 1200px) {
  .u-pb25-pc {
    padding-bottom: 25px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pb25-tb {
    padding-bottom: 25px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pb25-sp {
    padding-bottom: 25px !important;
  }
}

.u-mb30 {
  margin-bottom: 30px !important;
}

@media screen and (min-width: 1200px) {
  .u-mb30-pc {
    margin-bottom: 30px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mb30-tb {
    margin-bottom: 30px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mb30-sp {
    margin-bottom: 30px !important;
  }
}

.u-pb30 {
  padding-bottom: 30px !important;
}

@media screen and (min-width: 1200px) {
  .u-pb30-pc {
    padding-bottom: 30px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pb30-tb {
    padding-bottom: 30px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pb30-sp {
    padding-bottom: 30px !important;
  }
}

.u-mb35 {
  margin-bottom: 35px !important;
}

@media screen and (min-width: 1200px) {
  .u-mb35-pc {
    margin-bottom: 35px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mb35-tb {
    margin-bottom: 35px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mb35-sp {
    margin-bottom: 35px !important;
  }
}

.u-pb35 {
  padding-bottom: 35px !important;
}

@media screen and (min-width: 1200px) {
  .u-pb35-pc {
    padding-bottom: 35px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pb35-tb {
    padding-bottom: 35px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pb35-sp {
    padding-bottom: 35px !important;
  }
}

.u-mb40 {
  margin-bottom: 40px !important;
}

@media screen and (min-width: 1200px) {
  .u-mb40-pc {
    margin-bottom: 40px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mb40-tb {
    margin-bottom: 40px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mb40-sp {
    margin-bottom: 40px !important;
  }
}

.u-pb40 {
  padding-bottom: 40px !important;
}

@media screen and (min-width: 1200px) {
  .u-pb40-pc {
    padding-bottom: 40px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pb40-tb {
    padding-bottom: 40px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pb40-sp {
    padding-bottom: 40px !important;
  }
}

.u-mb45 {
  margin-bottom: 45px !important;
}

@media screen and (min-width: 1200px) {
  .u-mb45-pc {
    margin-bottom: 45px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mb45-tb {
    margin-bottom: 45px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mb45-sp {
    margin-bottom: 45px !important;
  }
}

.u-pb45 {
  padding-bottom: 45px !important;
}

@media screen and (min-width: 1200px) {
  .u-pb45-pc {
    padding-bottom: 45px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pb45-tb {
    padding-bottom: 45px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pb45-sp {
    padding-bottom: 45px !important;
  }
}

.u-mb50 {
  margin-bottom: 50px !important;
}

@media screen and (min-width: 1200px) {
  .u-mb50-pc {
    margin-bottom: 50px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mb50-tb {
    margin-bottom: 50px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mb50-sp {
    margin-bottom: 50px !important;
  }
}

.u-pb50 {
  padding-bottom: 50px !important;
}

@media screen and (min-width: 1200px) {
  .u-pb50-pc {
    padding-bottom: 50px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pb50-tb {
    padding-bottom: 50px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pb50-sp {
    padding-bottom: 50px !important;
  }
}

.u-mb55 {
  margin-bottom: 55px !important;
}

@media screen and (min-width: 1200px) {
  .u-mb55-pc {
    margin-bottom: 55px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mb55-tb {
    margin-bottom: 55px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mb55-sp {
    margin-bottom: 55px !important;
  }
}

.u-pb55 {
  padding-bottom: 55px !important;
}

@media screen and (min-width: 1200px) {
  .u-pb55-pc {
    padding-bottom: 55px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pb55-tb {
    padding-bottom: 55px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pb55-sp {
    padding-bottom: 55px !important;
  }
}

.u-mb60 {
  margin-bottom: 60px !important;
}

@media screen and (min-width: 1200px) {
  .u-mb60-pc {
    margin-bottom: 60px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-mb60-tb {
    margin-bottom: 60px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mb60-sp {
    margin-bottom: 60px !important;
  }
}

.u-pb60 {
  padding-bottom: 60px !important;
}

@media screen and (min-width: 1200px) {
  .u-pb60-pc {
    padding-bottom: 60px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pb60-tb {
    padding-bottom: 60px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pb60-sp {
    padding-bottom: 60px !important;
  }
}

.u-ml0 {
  margin-left: 0px !important;
}

@media screen and (min-width: 1200px) {
  .u-ml0-pc {
    margin-left: 0px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-ml0-tb {
    margin-left: 0px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-ml0-sp {
    margin-left: 0px !important;
  }
}

.u-pl0 {
  padding-left: 0px !important;
}

@media screen and (min-width: 1200px) {
  .u-pl0-pc {
    padding-left: 0px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pl0-tb {
    padding-left: 0px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pl0-sp {
    padding-left: 0px !important;
  }
}

.u-ml5 {
  margin-left: 5px !important;
}

@media screen and (min-width: 1200px) {
  .u-ml5-pc {
    margin-left: 5px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-ml5-tb {
    margin-left: 5px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-ml5-sp {
    margin-left: 5px !important;
  }
}

.u-pl5 {
  padding-left: 5px !important;
}

@media screen and (min-width: 1200px) {
  .u-pl5-pc {
    padding-left: 5px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pl5-tb {
    padding-left: 5px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pl5-sp {
    padding-left: 5px !important;
  }
}

.u-ml10 {
  margin-left: 10px !important;
}

@media screen and (min-width: 1200px) {
  .u-ml10-pc {
    margin-left: 10px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-ml10-tb {
    margin-left: 10px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-ml10-sp {
    margin-left: 10px !important;
  }
}

.u-pl10 {
  padding-left: 10px !important;
}

@media screen and (min-width: 1200px) {
  .u-pl10-pc {
    padding-left: 10px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pl10-tb {
    padding-left: 10px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pl10-sp {
    padding-left: 10px !important;
  }
}

.u-ml15 {
  margin-left: 15px !important;
}

@media screen and (min-width: 1200px) {
  .u-ml15-pc {
    margin-left: 15px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-ml15-tb {
    margin-left: 15px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-ml15-sp {
    margin-left: 15px !important;
  }
}

.u-pl15 {
  padding-left: 15px !important;
}

@media screen and (min-width: 1200px) {
  .u-pl15-pc {
    padding-left: 15px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pl15-tb {
    padding-left: 15px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pl15-sp {

    padding-left: 15px !important;
  }
}

.u-ml20 {
  margin-left: 20px !important;
}

@media screen and (min-width: 1200px) {
  .u-ml20-pc {
    margin-left: 20px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-ml20-tb {
    margin-left: 20px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-ml20-sp {
    margin-left: 20px !important;
  }
}

.u-pl20 {
  padding-left: 20px !important;
}

@media screen and (min-width: 1200px) {
  .u-pl20-pc {
    padding-left: 20px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pl20-tb {
    padding-left: 20px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pl20-sp {
    padding-left: 20px !important;
  }
}

.u-ml25 {
  margin-left: 25px !important;
}

@media screen and (min-width: 1200px) {
  .u-ml25-pc {
    margin-left: 25px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-ml25-tb {
    margin-left: 25px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-ml25-sp {
    margin-left: 25px !important;
  }
}

.u-pl25 {
  padding-left: 25px !important;
}

@media screen and (min-width: 1200px) {
  .u-pl25-pc {
    padding-left: 25px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pl25-tb {
    padding-left: 25px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pl25-sp {
    padding-left: 25px !important;
  }
}

.u-ml30 {
  margin-left: 30px !important;
}

@media screen and (min-width: 1200px) {
  .u-ml30-pc {
    margin-left: 30px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-ml30-tb {
    margin-left: 30px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-ml30-sp {
    margin-left: 30px !important;
  }
}

.u-pl30 {
  padding-left: 30px !important;
}

@media screen and (min-width: 1200px) {
  .u-pl30-pc {
    padding-left: 30px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pl30-tb {
    padding-left: 30px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pl30-sp {
    padding-left: 30px !important;
  }
}

.u-ml35 {
  margin-left: 35px !important;
}

@media screen and (min-width: 1200px) {
  .u-ml35-pc {
    margin-left: 35px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-ml35-tb {
    margin-left: 35px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-ml35-sp {
    margin-left: 35px !important;
  }
}

.u-pl35 {
  padding-left: 35px !important;
}

@media screen and (min-width: 1200px) {
  .u-pl35-pc {
    padding-left: 35px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pl35-tb {
    padding-left: 35px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pl35-sp {
    padding-left: 35px !important;
  }
}

.u-ml40 {
  margin-left: 40px !important;
}

@media screen and (min-width: 1200px) {
  .u-ml40-pc {
    margin-left: 40px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-ml40-tb {
    margin-left: 40px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-ml40-sp {
    margin-left: 40px !important;
  }
}

.u-pl40 {
  padding-left: 40px !important;
}

@media screen and (min-width: 1200px) {
  .u-pl40-pc {
    padding-left: 40px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pl40-tb {
    padding-left: 40px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pl40-sp {
    padding-left: 40px !important;
  }
}

.u-ml45 {
  margin-left: 45px !important;
}

@media screen and (min-width: 1200px) {
  .u-ml45-pc {
    margin-left: 45px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-ml45-tb {
    margin-left: 45px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-ml45-sp {
    margin-left: 45px !important;
  }
}

.u-pl45 {
  padding-left: 45px !important;
}

@media screen and (min-width: 1200px) {
  .u-pl45-pc {
    padding-left: 45px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pl45-tb {
    padding-left: 45px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pl45-sp {
    padding-left: 45px !important;
  }
}

.u-ml50 {
  margin-left: 50px !important;
}

@media screen and (min-width: 1200px) {
  .u-ml50-pc {
    margin-left: 50px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-ml50-tb {
    margin-left: 50px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-ml50-sp {
    margin-left: 50px !important;
  }
}

.u-pl50 {
  padding-left: 50px !important;
}

@media screen and (min-width: 1200px) {
  .u-pl50-pc {
    padding-left: 50px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pl50-tb {
    padding-left: 50px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pl50-sp {
    padding-left: 50px !important;
  }
}

.u-ml55 {
  margin-left: 55px !important;
}

@media screen and (min-width: 1200px) {
  .u-ml55-pc {
    margin-left: 55px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-ml55-tb {
    margin-left: 55px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-ml55-sp {
    margin-left: 55px !important;
  }
}

.u-pl55 {
  padding-left: 55px !important;
}

@media screen and (min-width: 1200px) {
  .u-pl55-pc {
    padding-left: 55px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pl55-tb {
    padding-left: 55px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pl55-sp {
    padding-left: 55px !important;
  }
}

.u-ml60 {
  margin-left: 60px !important;
}

@media screen and (min-width: 1200px) {
  .u-ml60-pc {
    margin-left: 60px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-ml60-tb {
    margin-left: 60px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-ml60-sp {
    margin-left: 60px !important;
  }
}

.u-pl60 {
  padding-left: 60px !important;
}

@media screen and (min-width: 1200px) {
  .u-pl60-pc {
    padding-left: 60px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-pl60-tb {
    padding-left: 60px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-pl60-sp {
    padding-left: 60px !important;
  }
}

/* ------------------------------------------------- *
 *        position
 * ------------------------------------------------- */
.u-positionS {
  position: static !important;
}

@media screen and (min-width: 1200px) {
  .u-positionS-pc {
    position: static !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-positionS-tb {
    position: static !important;
  }
}

@media screen and (max-width: 767px) {
  .u-positionS-sp {
    position: static !important;
  }
}

.u-positionR {
  position: relative !important;
}

@media screen and (min-width: 1200px) {
  .u-positionR-pc {
    position: relative !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-positionR-tb {
    position: relative !important;
  }
}

@media screen and (max-width: 767px) {
  .u-positionR-sp {
    position: relative !important;
  }
}

.u-positionA {
  position: absolute !important;
}

@media screen and (min-width: 1200px) {
  .u-positionA-pc {
    position: absolute !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-positionA-tb {
    position: absolute !important;
  }
}

@media screen and (max-width: 767px) {
  .u-positionA-sp {
    position: absolute !important;
  }
}

/* ------------------------------------------------- *
 *        font-size
 * ------------------------------------------------- */
.u-fs10 {
  font-size: 1rem !important;
}

@media screen and (min-width: 1200px) {
  .u-fs10-pc {
    font-size: 1rem !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-fs10-tb {
    font-size: 1rem !important;
  }
}

@media screen and (max-width: 767px) {
  .u-fs10-sp {
    font-size: 1rem !important;
  }
}

.u-fs12 {
  font-size: 1.2rem !important;
}

@media screen and (min-width: 1200px) {
  .u-fs12-pc {
    font-size: 1.2rem !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-fs12-tb {
    font-size: 1.2rem !important;
  }
}

@media screen and (max-width: 767px) {
  .u-fs12-sp {
    font-size: 1.2rem !important;
  }
}

.u-fs14 {
  font-size: 1.4rem !important;
}

@media screen and (min-width: 1200px) {
  .u-fs14-pc {
    font-size: 1.4rem !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-fs14-tb {
    font-size: 1.4rem !important;
  }
}

@media screen and (max-width: 767px) {
  .u-fs14-sp {
    font-size: 1.4rem !important;
  }
}

.u-fs16 {
  font-size: 1.6rem !important;
}

@media screen and (min-width: 1200px) {
  .u-fs16-pc {
    font-size: 1.6rem !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-fs16-tb {
    font-size: 1.6rem !important;
  }
}

@media screen and (max-width: 767px) {
  .u-fs16-sp {
    font-size: 1.6rem !important;
  }
}

.u-fs18 {
  font-size: 1.8rem !important;
}

@media screen and (min-width: 1200px) {
  .u-fs18-pc {
    font-size: 1.8rem !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-fs18-tb {
    font-size: 1.8rem !important;
  }
}

@media screen and (max-width: 767px) {
  .u-fs18-sp {
    font-size: 1.8rem !important;
  }
}

.u-fs20 {
  font-size: 2rem !important;
}

@media screen and (min-width: 1200px) {
  .u-fs20-pc {
    font-size: 2rem !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-fs20-tb {
    font-size: 2rem !important;
  }
}

@media screen and (max-width: 767px) {
  .u-fs20-sp {
    font-size: 2rem !important;
  }
}

.u-fs22 {
  font-size: 2.2rem !important;
}

@media screen and (min-width: 1200px) {
  .u-fs22-pc {
    font-size: 2.2rem !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-fs22-tb {
    font-size: 2.2rem !important;
  }
}

@media screen and (max-width: 767px) {
  .u-fs22-sp {
    font-size: 2.2rem !important;
  }
}

.u-fs24 {
  font-size: 2.4rem !important;
}

@media screen and (min-width: 1200px) {
  .u-fs24-pc {
    font-size: 2.4rem !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-fs24-tb {
    font-size: 2.4rem !important;
  }
}

@media screen and (max-width: 767px) {
  .u-fs24-sp {
    font-size: 2.4rem !important;
  }
}

.u-fs26 {
  font-size: 2.6rem !important;
}

@media screen and (min-width: 1200px) {
  .u-fs26-pc {
    font-size: 2.6rem !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-fs26-tb {
    font-size: 2.6rem !important;
  }
}

@media screen and (max-width: 767px) {
  .u-fs26-sp {
    font-size: 2.6rem !important;
  }
}

.u-fs28 {
  font-size: 2.8rem !important;
}

@media screen and (min-width: 1200px) {
  .u-fs28-pc {
    font-size: 2.8rem !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-fs28-tb {
    font-size: 2.8rem !important;
  }
}

@media screen and (max-width: 767px) {
  .u-fs28-sp {
    font-size: 2.8rem !important;
  }
}

.u-fs30 {
  font-size: 3rem !important;
}

@media screen and (min-width: 1200px) {
  .u-fs30-pc {
    font-size: 3rem !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-fs30-tb {
    font-size: 3rem !important;
  }
}

@media screen and (max-width: 767px) {
  .u-fs30-sp {
    font-size: 3rem !important;
  }
}

.u-fs32 {
  font-size: 3.2rem !important;
}

@media screen and (min-width: 1200px) {
  .u-fs32-pc {
    font-size: 3.2rem !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-fs32-tb {
    font-size: 3.2rem !important;
  }
}

@media screen and (max-width: 767px) {
  .u-fs32-sp {
    font-size: 3.2rem !important;
  }
}

/* ------------------------------------------------- *
 *        width
 * ------------------------------------------------- */
.u-w0p {
  width: 0%!important;
}

@media screen and (min-width: 1200px) {
  .u-w0p-pc {
    width: 0%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w0p-tb {
    width: 0%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w0p-sp {
    width: 0%!important;
  }
}

.u-w5p {
  width: 5%!important;
}

@media screen and (min-width: 1200px) {
  .u-w5p-pc {
    width: 5%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w5p-tb {
    width: 5%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w5p-sp {
    width: 5%!important;
  }
}

.u-w10p {
  width: 10%!important;
}

@media screen and (min-width: 1200px) {
  .u-w10p-pc {
    width: 10%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w10p-tb {
    width: 10%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w10p-sp {
    width: 10%!important;
  }
}

.u-w15p {
  width: 15%!important;
}

@media screen and (min-width: 1200px) {
  .u-w15p-pc {
    width: 15%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w15p-tb {
    width: 15%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w15p-sp {
    width: 15%!important;
  }
}

.u-w20p {
  width: 20%!important;
}

@media screen and (min-width: 1200px) {
  .u-w20p-pc {
    width: 20%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w20p-tb {
    width: 20%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w20p-sp {
    width: 20%!important;
  }
}

.u-w25p {
  width: 25%!important;
}

@media screen and (min-width: 1200px) {
  .u-w25p-pc {
    width: 25%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w25p-tb {
    width: 25%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w25p-sp {
    width: 25%!important;
  }
}

.u-w30p {
  width: 30%!important;
}

@media screen and (min-width: 1200px) {
  .u-w30p-pc {
    width: 30%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w30p-tb {
    width: 30%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w30p-sp {
    width: 30%!important;
  }
}

.u-w35p {
  width: 35%!important;
}

@media screen and (min-width: 1200px) {
  .u-w35p-pc {
    width: 35%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w35p-tb {
    width: 35%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w35p-sp {
    width: 35%!important;
  }
}

.u-w40p {
  width: 40%!important;
}

@media screen and (min-width: 1200px) {
  .u-w40p-pc {
    width: 40%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w40p-tb {
    width: 40%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w40p-sp {
    width: 40%!important;
  }
}

.u-w45p {
  width: 45%!important;
}

@media screen and (min-width: 1200px) {
  .u-w45p-pc {
    width: 45%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w45p-tb {
    width: 45%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w45p-sp {
    width: 45%!important;

  }
}

.u-w50p {
  width: 50%!important;
}

@media screen and (min-width: 1200px) {
  .u-w50p-pc {
    width: 50%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w50p-tb {
    width: 50%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w50p-sp {
    width: 50%!important;
  }
}

.u-w55p {
  width: 55%!important;
}

@media screen and (min-width: 1200px) {
  .u-w55p-pc {
    width: 55%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w55p-tb {
    width: 55%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w55p-sp {
    width: 55%!important;
  }
}

.u-w60p {
  width: 60%!important;
}

@media screen and (min-width: 1200px) {
  .u-w60p-pc {
    width: 60%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w60p-tb {
    width: 60%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w60p-sp {
    width: 60%!important;
  }
}

.u-w65p {
  width: 65%!important;
}

@media screen and (min-width: 1200px) {
  .u-w65p-pc {
    width: 65%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w65p-tb {
    width: 65%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w65p-sp {
    width: 65%!important;
  }
}

.u-w70p {
  width: 70%!important;
}

@media screen and (min-width: 1200px) {
  .u-w70p-pc {
    width: 70%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w70p-tb {
    width: 70%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w70p-sp {
    width: 70%!important;
  }
}

.u-w75p {
  width: 75%!important;
}

@media screen and (min-width: 1200px) {
  .u-w75p-pc {
    width: 75%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w75p-tb {
    width: 75%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w75p-sp {
    width: 75%!important;
  }
}

.u-w80p {
  width: 80%!important;
}

@media screen and (min-width: 1200px) {
  .u-w80p-pc {
    width: 80%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w80p-tb {
    width: 80%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w80p-sp {
    width: 80%!important;
  }
}

.u-w85p {
  width: 85%!important;
}

@media screen and (min-width: 1200px) {
  .u-w85p-pc {
    width: 85%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w85p-tb {
    width: 85%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w85p-sp {
    width: 85%!important;
  }
}

.u-w90p {
  width: 90%!important;
}

@media screen and (min-width: 1200px) {
  .u-w90p-pc {
    width: 90%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w90p-tb {
    width: 90%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w90p-sp {
    width: 90%!important;
  }
}

.u-w95p {
  width: 95%!important;
}

@media screen and (min-width: 1200px) {
  .u-w95p-pc {
    width: 95%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w95p-tb {
    width: 95%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w95p-sp {
    width: 95%!important;
  }
}

.u-w100p {
  width: 100%!important;
}

@media screen and (min-width: 1200px) {
  .u-w100p-pc {
    width: 100%!important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-w100p-tb {
    width: 100%!important;
  }
}

@media screen and (max-width: 767px) {
  .u-w100p-sp {
    width: 100%!important;
  }
}

/* ------------------------------------------------- *
 *        text
 * ------------------------------------------------- */
.u-fNormal {
  font-weight: 400 !important;
}

@media screen and (min-width: 1200px) {
  .u-fNormal-pc {
    font-weight: 400 !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-fNormal-tb {
    font-weight: 400 !important;
  }
}

@media screen and (max-width: 767px) {
  .u-fNormal-sp {
    font-weight: 400 !important;
  }
}

.u-fBold {
  font-weight: 700 !important;
}

@media screen and (min-width: 1200px) {
  .u-fBold-pc {
    font-weight: 700 !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-fBold-tb {
    font-weight: 700 !important;
  }
}

@media screen and (max-width: 767px) {
  .u-fBold-sp {
    font-weight: 700 !important;
  }
}

.u-fColorBase {
  color: #000 !important;
}

@media screen and (min-width: 1200px) {
  .u-fColorBase-pc {
    color: #000 !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-fColorBase-tb {
    color: #000 !important;
  }
}

@media screen and (max-width: 767px) {
  .u-fColorBase-sp {
    color: #000 !important;
  }
}

.u-fColorRed {
  color: #b40000 !important;
}

@media screen and (min-width: 1200px) {
  .u-fColorRed-pc {
    color: #b40000 !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-fColorRed-tb {
    color: #b40000 !important;
  }
}

@media screen and (max-width: 767px) {
  .u-fColorRed-sp {
    color: #b40000 !important;
  }
}

.u-tUpper {
  text-transform: uppercase !important;
}

@media screen and (min-width: 1200px) {
  .u-tUpper-pc {
    text-transform: uppercase !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-tUpper-tb {
    text-transform: uppercase !important;
  }
}

@media screen and (max-width: 767px) {
  .u-tUpper-sp {
    text-transform: uppercase !important;
  }
}

.u-tTnone {
  text-transform: none !important;
}

@media screen and (min-width: 1200px) {
  .u-tTnone-pc {
    text-transform: none !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-tTnone-tb {
    text-transform: none !important;
  }
}

@media screen and (max-width: 767px) {
  .u-tTnone-sp {
    text-transform: none !important;
  }
}

.u-fontJp {
  font-family: "Noto Sans JP", "游ゴシック体", YuGothic, " 游ゴシック", "Yu Gothic", "メイリオ", sans-serif !important;
}

@media screen and (min-width: 1200px) {
  .u-fontJp-pc {
    font-family: "Noto Sans JP", "游ゴシック体", YuGothic, " 游ゴシック", "Yu Gothic", "メイリオ", sans-serif !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-fontJp-tb {
    font-family: "Noto Sans JP", "游ゴシック体", YuGothic, " 游ゴシック", "Yu Gothic", "メイリオ", sans-serif !important;
  }
}

@media screen and (max-width: 767px) {
  .u-fontJp-sp {
    font-family: "Noto Sans JP", "游ゴシック体", YuGothic, " 游ゴシック", "Yu Gothic", "メイリオ", sans-serif !important;
  }
}

.u-fontEn {
  font-family: "Rock Salt", cursive !important;
}

@media screen and (min-width: 1200px) {
  .u-fontEn-pc {
    font-family: "Rock Salt", cursive !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .u-fontEn-tb {
    font-family: "Rock Salt", cursive !important;
  }
}

@media screen and (max-width: 767px) {
  .u-fontEn-sp {
    font-family: "Rock Salt", cursive !important;
  }
}