/* ----------------------------------------------------------------------------------------------------------
utility.css
---------------------------------------------------------------------------------------------------------- */
/* エージェント別 */
.u-pc { display: block !important; }
.u-sp { display: none; }
/********* sp *********/
@media only screen and (max-width: 750px) {
.u-pc { display: none !important; }
.u-sp { display: block !important; }}

/* フォントサイズ */
.u-fs--48 { font-size: 48px; }
/********* sp *********/
@media only screen and (max-width: 750px) {
.u-fs--48 { font-size: 36px; }}

.u-fs--46 { font-size: 46px; }
/********* sp *********/
@media only screen and (max-width: 750px) {
.u-fs--46 { font-size: 32px; }}

.u-fs--36 { font-size: 36px; }
/********* sp *********/
@media only screen and (max-width: 750px) {
.u-fs--36 { font-size: 27px; }}

.u-fs--30 { font-size: 30px; }
/********* sp *********/
@media only screen and (max-width: 750px) {
.u-fs--30 { font-size: 24px; }}

.u-fs--28 { font-size: 28px; }
/********* sp *********/
@media only screen and (max-width: 750px) {
.u-fs--28 { font-size: 22px; }}

.u-fs--24 { font-size: 24px; }
/********* sp *********/
@media only screen and (max-width: 750px) {
.u-fs--24 { font-size: 18px; }}

.u-fs--22 { font-size: 22px; }
/********* sp *********/
@media only screen and (max-width: 750px) {
.u-fs--22 { font-size: 16px; }}

.u-fs--20 { font-size: 20px; }
/********* sp *********/
@media only screen and (max-width: 750px) {
.u-fs--20 { font-size: 14px; }}

.u-fs--18 { font-size: 18px; }
/********* sp *********/
@media only screen and (max-width: 750px) {
.u-fs--18 { font-size: 12px; }}

.u-fs--14 { font-size: 14px; }
/********* sp *********/
@media only screen and (max-width: 750px) {
.u-fs--14 { font-size: 11px; }}

.u-fs--12 { font-size: 12px; }
/********* sp *********/
@media only screen and (max-width: 750px) {
.u-fs--12 { font-size: 10px; }}

/* フォントカラー */
.u-fc--white,
.u-fc--white a { color: #fff; }
.u-fc--gray,
.u-fc--gray a { color: #808080; }
.u-fc--red,
.u-fc--red a { color: #cc0000; }

/* テキストレイアウト */
.u-txt--left { text-align: left; }
.u-txt--center { text-align: center; }
.u-txt--right { text-align: right; }

/* フォントウェイト */
.u-fw--l { font-weight: 200; }
.u-fw--m { font-weight: 300; }
.u-fw--b { font-weight: 600; }

/* 行間 */
.u-lh--1em { line-height: 1em; }
.u-lh--1_2em { line-height: 1.2em; }
.u-lh--1_4em { line-height: 1.4em; }

/* マージン */
.u-mt--0_5em { margin-top: 0.5em; }
.u-mt--1em { margin-top: 1em; }
.u-mt--2em { margin-top: 2em; }
.u-mt--3em { margin-top: 3em; }
.u-mt--4em { margin-top: 4em; }
.u-mt--5em { margin-top: 5em; }

.u-mb--0_5em { margin-bottom: 0.5em; }
.u-mb--1em { margin-bottom: 1em; }
.u-mb--2em { margin-bottom: 2em; }
.u-mb--3em { margin-bottom: 3em; }
.u-mb--4em { margin-bottom: 4em; }
.u-mb--5em { margin-bottom: 5em; }

.u-ml--0_5em { margin-left: 0.5em; }
.u-ml--1em { margin-left: 1em; }
.u-ml--2em { margin-left: 2em; }
.u-ml--3em { margin-left: 3em; }
.u-ml--4em { margin-left: 4em; }
.u-ml--5em { margin-left: 5em; }

.u-mr--0_5em { margin-right: 0.5em; }
.u-mr--1em { margin-right: 1em; }
.u-mr--2em { margin-right: 2em; }
.u-mr--3em { margin-right: 3em; }
.u-mr--4em { margin-right: 4em; }
.u-mr--5em { margin-right: 5em; }

/* テキストアンダーライン */
.u-underline {
 border-bottom: solid 3px #333;
 padding-bottom: 0.3em;
 display: inline-block;
}

/* ボタン */
.u-linkbtn span {
 margin-left: 15px;
}

.u-linkbtn span {
 color: #0063ad;
 position: relative;
 text-decoration: none;
 font-size: 14px;
}

.u-linkbtn span:before {
 background-image: url(../images/ic_link_circle.png);
 content:"";
 position:absolute;
 top: 50%;
 left: -15px;
 width: 10px;
 height: 10px;
 margin-top: -4px;
 background-repeat: no-repeat;
 background-size: cover;
}

.u-linkbtn__blank span:after {
 background-image: url(../images/ic_link_blank.png);
 content:"";
 position:absolute;
 top: 50%;
 right: -15px;
 width: 10px;
 height: 10px;
 margin-top: -4px;
 background-repeat: no-repeat;
 background-size: cover;
}

.u-linkbtn__pdf span:after {
 content:"[PDF]";
 position:absolute;
 top: 4px;
 right: -30px;
 color: #808080;
 font-size: 10px;
}

/* ページトップボタン */
.u-btn__pagetop {
 padding: 5px 15px 5px 30px;
 display: inline-block;
 background-color: #faf5e5;
 text-align: center;
 cursor: pointer;
 -webkit-border-radius: 5px 5px 0 0;
 -moz-border-radius: 5px 5px 0 0;
 border-radius: 5px 5px 0 0;
}
/********* sp *********/
@media only screen and (max-width: 750px) {
.u-btn__pagetop {
 padding: 10px 0;
 display: block;
 background-color: #faf5e5;;
 cursor: pointer;
 -webkit-border-radius: 0;
 -moz-border-radius: 0;
 border-radius: 0;
 }
}

.u-btn__pagetop span {
 color: #0063ad;
 position: relative;
 font-size: 14px;
}

.u-btn__pagetop span:before {
 background-image: url(../images/ic_link_circle_pagetop.png);
 content:"";
 position:absolute;
 top: 50%;
 left: -15px;
 width: 10px;
 height: 10px;
 margin-top: -4px;
 background-repeat: no-repeat;
 background-size: cover;
}

/* マウスオーバー */
.u-ov__img:hover {
  background-color: #faf5e5;
}

.u-ov__img:hover a {
 text-decoration: none;
 background: rgba(255,245,229,0.2);
}

.u-ov__img:hover {
 text-decoration: none;
}

/********* pcのみ *********/
@media only screen and (min-width: 751px) {
.u-ov:hover {
 text-decoration: underline;
 }

.u-ov__on {
 opacity: 0.7;  
 filter: alpha(opacity=70);
}

/* マウスオーバーで画像拡大 */
.u-ov__img_up img {
 display: block;
 transition-duration: 0.3s;
 }

.u-ov__img_up:hover img {
 transform: scale(1.1);
 transition-duration: 0.3s;
 }

/* テキストリンク アンダーライン */
.u-ov__txt_underline:hover {
 text-decoration: underline;
 }
}

/* ボタン2 */

.u-linkbtn2 span {
 color: #0063ad !important;
 position: relative;
 text-decoration: none;
 font-size: 16px;
}

.u-linkbtn2__blank span:after {
 background-image: url(../images/ic_link_blank.png);
 content:"";
 position:absolute;
 top: 50%;
 right: -15px;
 width: 10px;
 height: 10px;
 margin-top: -4px;
 background-repeat: no-repeat;
 background-size: cover;
}

@media all and (-ms-high-contrast: none) {
 *::-ms-backdrop, .u-ov__img_up:hover img {
 transform: none;
 }
}

@media all and (-ms-high-contrast: none) {
 .u-ov__img_up:hover img {
 transform: none;
 }
}


