@charset "utf-8";

/*========================================================================================================================


  ◇◆◇ レイアウト ◇◆◇
  
  1.  header
  2.  nav
  3.  contents
  4.  side
  5.  footer
  99. parts  
  
  
========================================================================================================================*/

/*----------------------------------------------------------------------------------------------------

  2.  nav
  
----------------------------------------------------------------------------------------------------*/

#navi a,
#navi a:visited,
#navi a:hover {
    color: #005491;
    text-decoration: none;
}

@media print,
screen and (min-width:768px) {
    #navi {
        background: url(../img/navi_bg.jpg) repeat-x;
        width: 100%;
        height: 90px;
        position: fixed;
        top: 0;
        z-index: 100;
        min-width: 1160px;
        border-top: 4px solid #005491;
        box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
    }

    #navi ul {
        display: flex;
        /*追記20220304メニューが縮小するとずれてしまうので、ディスプレイフレックスを追記した*/
        width: 1080px;
        margin-left: auto;
        margin-right: auto;
        list-style: none;
        transition: 0.2s ease;
        border-left: 1px solid #005491;
        box-sizing: border-box;
    }

    #navi ul li {
        float: left;
        width: 153px;
        height: 90px;
        background-repeat: no-repeat;
        border-right: 1px solid #005491;
        transition: 0.3s;
    }

    #navi ul li.nav01 {
        background-image: url(../img/nav01_off.jpg);
    }
    #navi ul li.nav02 {
        background-image: url(../img/nav02_off.jpg);
    }
    #navi ul li.nav03 {
        background-image: url(../img/nav03_off.jpg);
    }
    #navi ul li.nav04 {
        background-image: url(../img/nav04_off.jpg);
    }
    #navi ul li.nav05 {
        background-image: url(../img/nav05_off.jpg);
    }
    #navi ul li.nav06 {
        background-image: url(../img/nav06_off.jpg);
    }
    #navi ul li.nav07 {
        background-image: url(../img/nav07_off.jpg);
        width: 154px;
    }
    #navi ul li.nav08 {
        background-image: url(../img/nav08_off.jpg);
        width: 154px;
    }

    #navi ul li.nav01:hover,
    #navi ul li.nav01.active {
        background-image: url(../img/nav01_on.jpg);
    }
    #navi ul li.nav02:hover,
    #navi ul li.nav02.active {
        background-image: url(../img/nav02_on.jpg);
    }
    #navi ul li.nav03:hover,
    #navi ul li.nav03.active {
        background-image: url(../img/nav03_on.jpg);
    }
    #navi ul li.nav04:hover,
    #navi ul li.nav04.active {
        background-image: url(../img/nav04_on.jpg);
    }
    #navi ul li.nav05:hover,
    #navi ul li.nav05.active {
        background-image: url(../img/nav05_on.jpg);
    }
    #navi ul li.nav06:hover,
    #navi ul li.nav06.active {
        background-image: url(../img/nav06_on.jpg);
    }
    #navi ul li.nav07:hover,
    #navi ul li.nav07.active {
        background-image: url(../img/nav07_on.jpg);
    }
    #navi ul li.nav08:hover,
    #navi ul li.nav08.active {
        background-image: url(../img/nav08_on.jpg);
    }

    #navi ul li a {
        display: block;
        width: 100%;
        height: 100%;
        z-index: 2;
        position: relative;
    }

    #navi .pulldown {
        display: none;
        position: fixed;
        z-index: 2;
        top: 94px;
        left: 0;
        margin: 0;
        padding: 26px 0;
        background-image: url(../img/nav_pullbg.gif);
        width: 100%;
    }

    #navi .pulldown ul {
        border-left: 0;
        display: -webkit-box;
        display: -moz-box;
        display: -ms-box;
        display: -webkit-flexbox;
        display: -moz-flexbox;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: flex;
        -webkit-box-lines: multiple;
        -moz-box-lines: multiple;
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    #navi .pulldown li {
        width: 200px;
        border-right: none;
        background-color: #fff;
        margin-right: 20px;
        padding-bottom: 20px;
        text-indent: 0;
        text-align: center;
        height: auto;
        transition: 0.3s;
    }

    #navi .pulldown li:last-child {
        width: 198px;
        margin-right: 0;
    }

    #navi .pulldown li::before,
    #navi .pulldown li::after {
        position: absolute;
        z-index: -1;
        display: block;
        content: '';
    }
    #navi .pulldown li,
    #navi .pulldown li::before,
    #navi .pulldown li::after {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-transition: all .3s;
        transition: all .3s;
    }

    #navi .pulldown li {
        position: relative;
        z-index: 2;
        background-color: #fff;
    }
    #navi .pulldown li:hover {
        color: #fff;
    }
    #navi .pulldown li::after {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        -webkit-transform: scale(.75);
        transform: scale(.75);
    }
    #navi .pulldown li:hover::after {
        background: #fffec3;
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    #navi .pulldown li a {
        display: block;
        width: 100%;
        height: 100%;
        color: #555;
        padding-top: 20px;
    }

    #navi .pulldown li .linktitle {
        width: 180px;
        color: #049acd;
        border-bottom: 1px dotted #959595;
        padding-bottom: 15px;
        margin: 0 auto 15px;
        font-size: 19px;
        line-height: 1;
    }

    #navi .pulldown li .desc {
        width: 180px;
        margin: 0 auto;
        font-size: 16px;
        white-space: normal;
        text-align: left;
    }
}

@media screen and (max-width:767px) {
    #navi {
        display: none;
        width: 100%;
        position: absolute;
        left: 0;
        top: 0;
        z-index: 100;
        padding-top: 50px;
        background-color: rgba(4, 154, 205, 0.80);
    }
    #navi li {
        padding: 0.5em 1em;
        font-size: 125%;
        border-bottom: 1px solid #fff;
    }
    #navi li.txtNone {
        text-indent: 0;
        white-space: normal;
        overflow: auto;
    }
    #navi li a {
        display: block;
        width: 100%;
        height: 100%;
        background: url(../img/navi_arrow_sp.png) no-repeat center right;
        background-size: 10px;
    }
    #navi .pulldown {
        display: none;
        width: 100%;
        padding: 0;
    }
    #navi .pulldown ul {
        list-style-type: none;
        padding-top: 0.5em;
        border-top: none;
    }
    #navi .pulldown ul li {
        font-size: 87.5%;
        background-color: #fff;
        border-bottom: 1px solid #049acd !important;
    }
    #navi .pulldown ul li a {
        color: #049acd !important;
    }
    #navi .pulldown ul li .desc {
        display: none;
    }
    #navi li a {
        color: #fff !important;
    }
}


/*-----------------------------------------------------------------------------------
  スマホ用Navボタン
-----------------------------------------------------------------------------------*/

@media print,
screen and (min-width:768px) {
    .spNav-btn {
        display: none;
    }
}

@media screen and (max-width:767px) {
    .spNav-btn {
        text-align: center;
        position: absolute;
        right: 0;
        top: 0;
        padding: 10px 14px 18px;
        box-sizing: border-box;
        z-index: 105;
        background-color: rgba(255, 255, 255, 0.9);
        line-height: 1;
    }

    .spNav-btn_ic,
    .spNav-btn_ic span,
    .spNav-btn_ic span:before,
    .spNav-btn_ic span:after {
        display: inline-block;
        transition: all .4s;
        box-sizing: border-box;
    }
    .spNav-btn_ic {
        position: relative;
        width: 32px;
        height: 24px;
    }

    .spNav-btn_ic span,
    .spNav-btn_ic span:nth-of-type(2),
    .spNav-btn_ic span:nth-of-type(3) {
        position: absolute;
        left: 0;
        width: 100%;
        height: 2px;
        background-color: #049acd;
        border-radius: 1px;
    }
    .spNav-btn_ic span:nth-of-type(1) {
        top: 0;
    }
    .spNav-btn_ic span:nth-of-type(2) {
        top: 11px;
    }
    .spNav-btn_ic span:nth-of-type(3) {
        bottom: 0;
    }

    .spNav-btn.close .spNav-btn_ic span:nth-of-type(1),
    .spNav-btn.close .spNav-btn_ic span:nth-of-type(2),
    .spNav-btn.close .spNav-btn_ic span:nth-of-type(3) {
        background-color: #049acd;
    }

    .spNav-btn.close .spNav-btn_ic span:nth-of-type(1) {
        -webkit-transform: translateY(11px) rotate(-315deg);
        transform: translateY(11px) rotate(-315deg);
    }
    .spNav-btn.close .spNav-btn_ic span:nth-of-type(2) {
        opacity: 0;
    }
    .spNav-btn.close .spNav-btn_ic span:nth-of-type(3) {
        -webkit-transform: translateY(-11px) rotate(315deg);
        transform: translateY(-11px) rotate(315deg);
    }
    .spNav-btn_ic .menu {
        position: absolute;
        bottom: -16px;
        font-size: 10px;
        color: #049acd;
    }

}

@media screen and (max-width:500px) {
    .spNav-btn_ic {
        position: relative;
        width: 28px;
        height: 20px;
    }

    .spNav-btn_ic span:nth-of-type(2) {
        top: 9px;
    }

    .spNav-btn.close .spNav-btn_ic span:nth-of-type(1) {
        -webkit-transform: translateY(9px) rotate(-315deg);
        transform: translateY(9px) rotate(-315deg);
    }
    .spNav-btn.close .spNav-btn_ic span:nth-of-type(3) {
        -webkit-transform: translateY(-9px) rotate(315deg);
        transform: translateY(-9px) rotate(315deg);
    }
}


/*----------------------------------------------------------------------------------------------------

  3.  contents
  
----------------------------------------------------------------------------------------------------*/

#contents {
    width: 1080px;
    margin: 0 auto;
    border-left: 1px solid #cccccc;
    border-right: 1px solid #cccccc;
    box-sizing: border-box;
    padding: 2em 0 3em;
}

#contents h2 {
    position: relative;
    left: -20px;
    padding: 0.5em 0em 0.5em 1em;
    background: #049acd;
    color: white;
    font-weight: normal;
    font-size: 187.5%;
    line-height: 1;
    margin-bottom: 1em;
}

#contents h2::before {
    position: absolute;
    content: '';
    top: 100%;
    left: 0;
    border: none;
    border-bottom: solid 15px transparent;
    border-right: solid 20px #17799a;
}

#contents h2::after {
    position: absolute;
    content: '';
    top: 0;
    left: 100%;
    border-width: 0 1em 2em 0;
    border-style: solid;
    border-color: transparent;
    border-bottom-color: #049acd;
}

#contents .box {
    width: 1032px;
    margin: 0 auto;
    text-align: justify;
    text-justify: inter-ideograph;
    word-wrap: break-word;
    overflow-wrap: break-word;
    word-break: break-all;
    letter-spacing: 0.8pt;
}

#contents h3 {
    position: relative;
    line-height: 150%;
    font-size: 150%;
    margin-bottom: 1em;
    border-bottom: solid 4px #d9ebf5;
    width: 100%;
    letter-spacing: normal;
}

#contents h3 span {
    padding: 0 0.5em;
    border-bottom: solid 4px #3894CA;
    position: relative;
    bottom: 0px;
}

#contents h4 {
    font-size: 125%;
    margin-bottom: 0.5em;
    color: #3894CA;
}

#contents h5 {
    margin-bottom: 0.5em;
}

#contents ul {
    list-style: none;
    margin-bottom: 1.5em;
    text-indent: 1em;
}

#contents ol {
    margin-bottom: 1.5em;
    padding-left: 2em;
}

#contents p {
    text-indent: 1em;
    margin-bottom: 1em;
    overflow: auto;
}

#contents sup {
    text-indent: 0;
    display: inline-block;
    word-break: keep-all;
    word-wrap: normal;
}

#contents dt {
    font-weight: bold;
    font-size: 125%;
    margin-bottom: 0.5em;
}

#contents dd {
    margin: 0 0 1em 1em;
}

#contents figure {
    float: left;
    display: block;
    width: 30%;
    height: auto;
    margin-right: 1.5em;
    margin-bottom: 1.5em;
    box-sizing: border-box;
    text-align: center;
    font-size: 87.5%;
    position: relative;
    overflow: hidden;
    font-weight: bold;
}

#contents figure.duo1 {
    width: 48%;
    margin-right: 4%;
}

#contents figure.duo2 {
    width: 48%;
    margin-right: 0;
}

#contents figure img {
    display: block;
}

#contents figure .over {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4) url(../img/swipe_up.png) no-repeat center;
    -webkit-transition: .3s;
    transition: .3s;
    opacity: 0;
}

#contents figure:hover .over {
    opacity: 1;
}

#contents figure .photo-cap1 {
    margin-left: 105px;
}


@media screen and (max-width:767px) {
    #contents {
        width: auto;
        margin: 0 auto;
        box-sizing: border-box;
        border: none;
        padding: 2em 0 3em;
    }

    #contents h2 {
        padding-left: 1.5em;
    }

    #contents .box {
        width: auto;
        padding: 0 1.5em;
    }
    #contents h3 {
        width: 100%;
        word-wrap: break-word;
        border-bottom: solid 4px #3894CA;

    }
    #contents h3 span {
        border-bottom: 0;
        padding-left: 0;
    }
    #contents dd {
        margin-left: 0;
    }
}

@media screen and (max-width:600px) {
    #contents figure {
        float: none;
        width: 280px;
        margin: 0 auto 1em;
    }
    #contents figure.duo1 {
        width: 280px;
        margin: 0 auto 1em;
    }
    #contents figure.duo2 {
        width: 280px;
        margin: 0 auto 1em;
    }
}

/*----------------------------------------------------------------------------------------------------

  4. side
  
----------------------------------------------------------------------------------------------------*/

#side {
    display: table;
    position: fixed;
    /*20240719　位置調整200から変更*/
    top: 100px;
    right: 0px;
    z-index: 3;
    transition: 0.3s;
}

#side .message {
    display: table-cell;
    vertical-align: middle;
    width: 1em;
    line-height: 1;
    padding: 0.5em;
    background-color: #049acd;
    font-size: 150%;
    font-weight: bold;
    color: #fff;
}

#side .sidebox {
    display: table-cell;
    vertical-align: middle;
    padding: 1em;
    height: auto;
    background-color: #eeeeee;
    color: #0d8aa5;
}

#side .books {
    width: 192px;
    text-align: center;
    margin: auto;
}

#side .books .bookimg {
    transition: 0.3s;
}

/*追記20240719　書影の画像サイズを調整　#side .books img追記*/

#side .books img {
    width: 120px;
    height: auto;
}

#side .books .bookstitle {
    display: none;
}

#side .books .ps {
    /*追記20240719　文字サイズを調整font-sixeを追記*/
    font-size: 0.8em;
    margin-bottom: 0.5em;
}

#side .books .bookimg:hover {
    opacity: 0.7;
}

#side .books .btn {
    display: inline-block;
    color: #232323;
    background: #ffca7f;
    /* Old browsers */
    background: -moz-linear-gradient(top, #ffca7f 0%, #ff9600 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ffca7f 0%, #ff9600 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ffca7f 0%, #ff9600 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffca7f', endColorstr='#ff9600', GradientType=0);
    /* IE6-9 */
    border: 1px solid #cc5d04;
    border-radius: 15px;
    line-height: 1;
    font-weight: bold;
    text-decoration: none;
    padding: 4px 12px;
    margin-bottom: 1em;
}

#side .books .btn:hover {
    background: rgb(255, 150, 0);
    /* Old browsers */
    background: -moz-linear-gradient(top, rgba(255, 150, 0, 1) 0%, rgba(224, 123, 0, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(255, 150, 0, 1) 0%, rgba(224, 123, 0, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(255, 150, 0, 1) 0%, rgba(224, 123, 0, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff9600', endColorstr='#e07b00', GradientType=0);
    /* IE6-9 */
}

#side .books .btn:active {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e07b00+0,ff9600+100 */
    background: rgb(224, 123, 0);
    /* Old browsers */
    background: -moz-linear-gradient(top, rgba(224, 123, 0, 1) 0%, rgba(255, 150, 0, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(224, 123, 0, 1) 0%, rgba(255, 150, 0, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(224, 123, 0, 1) 0%, rgba(255, 150, 0, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e07b00', endColorstr='#ff9600', GradientType=0);
    /* IE6-9 */
}

#side .university {
    display: block;
    width: 185px;
    background-color: #fff;
    margin: 0 auto;
}

#side .university .uniname {
    background-color: #049acd;
    color: #fff;
    text-align: center;
    line-height: 2;
}

#side .university .address {
    line-height: 1.2;
    padding: 15px;
}

#side .university .address a {
    display: block;
    border: 1px solid #049acd;
    border-radius: 6px;
    color: #049acd;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    line-height: 1.2;
    padding: 6px 0;
    margin-top: 8px;
    transition: 0.2s all;
}

#side .university .address a:hover {
    background-color: #049acd;
    color: #fff;
}

@media screen and (max-width:1600px) {
    #side {
        right: -224px;
    }

    #side:hover {
        right: 0;
    }

    #side.fixed {
        top: 30px;
    }
}

@media screen and (max-width:767px) {
    #side {
        position: static;
        display: block;
    }
    #side .message {
        display: block;
        width: 100%;
        line-height: 1.2;
        box-sizing: border-box;
    }
    #side .sidebox {
        display: block;
        width: 100%;
        box-sizing: border-box;
        padding: 0;
    }
    #side .books {
        width: auto;
        padding: 1em;
    }
    #side .books .bookimg {
        float: left;
        margin-right: 1em;
    }
    #side .books .bookstitle {
        display: block;
        color: #049acd;
        margin-bottom: 1em;
    }
    #side .books .bookstitle span {
        font-size: 150%;
        font-weight: bold;
    }
    #side .books .ps {
        display: block;
        font-size: 87.5%;
        color: #464646;
        margin-bottom: 1em;
    }
    #side .books .btn {
        font-size: 112.5%;
        padding: 0.75em;
        margin-bottom: 0;
    }
    #side .university {
        width: 100%;
    }
    #side .university .address {
        width: 340px;
        margin: 0 auto;
    }
    #side .university .address p {
        float: left;
        margin-right: 1em;
    }
    #side .university .address a {
        float: right;
        padding: 0.5em;
        margin-top: 0;
    }
}

@media screen and (max-width:420px) {
    #side .message {
        font-size: 125.5%;
    }
}

@media screen and (max-width:370px) {
    #side .university .address {
        width: 320px;
    }
}

@media screen and (max-width:350px) {
    #side .university .address {
        width: 300px;
    }
}

@media screen and (max-width:330px) {
    #side .message {
        font-size: 117.5%;
    }
    #side .university .address {
        width: 290px;
    }
    #side .university .address p {
        font-size: 92.5%;
    }
}


/*----------------------------------------------------------------------------------------------------

  5. footer
  
----------------------------------------------------------------------------------------------------*/

.ft_wrap {
    width: 100%;
}

.ft_box {
    width: 1080px;
    margin: 0 auto;
}

.ft_cont1 {
    position: relative;
    z-index: 2;
    background-color: #049acd;
    box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.36);
    padding: 30px 0;
}

#footer .titlead {
    float: left;
}

#footer .pagetitle {
    float: left;
    vertical-align: middle;
    height: 68px;
    color: #fff;
    font-size: 42px;
    font-weight: normal;
    line-height: 1.2;
    padding-right: 15px
}

#footer .pagetitle a {
    color: #fff;
    text-decoration: none;
}

#footer .pagetitle span {
    display: block;
    font-size: 12px;
}

#footer .address {
    float: left;
    background-color: #fff;
    font-size: 87.5%;
    color: #0d8aa5;
    line-height: 1.2;
    padding: 0.5em 0.75em;
    box-sizing: border-box;
}

#footer .ft_navi {
    float: left;
    color: #fff;
    text-align: center;
    font-size: 87.5%;
    line-height: 1.5;
    margin-left: 18px;
    padding-left: 13px;
    border-left: 1px solid #fff;
}

#footer .ft_navi a {
    color: #fff;
    padding: 0 0.25em;
    text-decoration: none;
    transition: 0.3s ease;
}

#footer .ft_navi a:hover {
    color: #049acd;
    background-color: #fff;
}


#footer .ft_navi .copyright {
    color: #fff;
    text-align: center;
    font-size: 75.0%;
    padding: 0.5em 0;
}

.ft_cont2 {
    background-color: #005491;
    box-sizing: border-box;
    height: 60px;
}

#footer .counter {
    float: left;
    color: #fff;
    display: inline-block;
    font-weight: bold;
    font-size: 112.5%;
    line-height: 1;
    margin: 0;
    padding-top: 22px;
    width: 874px;
}

#footer .sp_br {
    display: none;
}

#footer .page-top {
    float: right;
    background-image: url(../img/pagetop.png);
    width: 200px;
    height: 60px;
    transition: 0.3s ease;
}

#footer .page-top:hover {
    background-color: rgba(255, 255, 255, 0.20);
    cursor: pointer;
}

@media screen and (max-width:767px) {
    .ft_box {
        width: auto;
        margin: 0 auto;
        box-sizing: border-box;
        padding: 1.5em 1em;
    }
    .ft_cont1 {
        padding: 0;
    }
    .ft_cont2 {
        padding: 0;
        height: auto;
    }
    #footer .titlead {
        width: 350px;
        float: none;
        margin: 0 auto 1em;
    }
    #footer .address {
        float: none;
        display: inline-block;
    }
    #footer .ft_navi {
        float: none;
        display: block;
        line-height: 2;
        margin-left: 0;
        padding-left: 0;
        border-left: none;
    }
    #footer .counter {
        width: auto;
        padding-top: 0;
    }
    #footer .sp_br {
        display: block;
    }
    #footer .page-top {
        float: none;
        position: fixed;
        z-index: 99;
        right: 10px;
        bottom: 20px;
        background-image: url(../img/pagetop_sp.png);
        background-size: contain;
        width: 40px;
        height: 40px;
    }
    #footer .page-top:hover {
        background-color: rgba(255, 255, 255, 0);
        cursor: pointer;
    }
}

@media screen and (max-width:380px) {
    #footer .titlead {
        width: 324px;
    }
    #footer .pagetitle {
        font-size: 42px;
    }
    #footer .pagetitle span {
        font-size: 12px;
    }
    #footer .address {
        font-size: 12px;
    }
}

@media screen and (max-width:340px) {
    #footer .titlead {
        width: 300px;
    }
    #footer .pagetitle {
        padding-right: 10px;
        font-size: 38px;
    }
    #footer .pagetitle span {
        font-size: 11px;
    }
}


/*----------------------------------------------------------------------------------------------------

  99. parts
  
----------------------------------------------------------------------------------------------------*/

.ro img:hover,
.ro:hover {
    opacity: 0.8;
    filter: alpha(opacity=80);
    -ms-filter: "alpha( opacity=80 )";
}

.dropshadow {
    box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.17);
    -moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.17);
    -webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.17);
}

div:after,
section:after,
article:after,
ul:after {
    content: "";
    display: block;
    clear: both;
}

/*------------------------------------------------------------------------------------------------------------------
　Float Image
-------------------------------------------------------------------------------------------------------------------*/

.photo-l {
    float: left;
    margin-right: 20px;
    margin-bottom: 20px;
}

.photo-r {
    float: right;
    margin-left: 20px;
    margin-bottom: 20px;
}

.photo-l img {
    width: 100%;
    height: auto;
    margin-top: 5px;
    max-width: 744px;
}

.photo-r img {
    width: 100%;
    height: auto;
    margin-top: 5px;
    max-width: 744px;
}

.photo-c {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 25px;
}

.photo-c img {
    max-width: 744px;
}

@media screen and (max-width:767px) {
    .photo-l {
        float: none;
        margin: 0 auto 20px;
    }

    .photo-r {
        float: none;
        margin: 0 auto 20px;
    }
}

/*------------------------------------------------------------------------------------------------------------------
　wp-pagenavi
-------------------------------------------------------------------------------------------------------------------*/

.wp-pagenavi {
    border-top: #d1d1d1 3px double;
    margin-top: 10px;
    padding-top: 40px;
    display: block !important;
    clear: both !important;
    text-align: left;
    width: 100%;
    word-break: break-all;
}

.wp-pagenavi a,
.wp-pagenavi span.pages,
.wp-pagenavi span.extend {
    color: #333333 !important;
    text-shadow: 0px 1px #F6F6F6 !important;
    width: 35px;
    height: 35px;
    line-height: 35px;
    border: solid 1px #B6B6B6 !important;
    box-shadow: 0px 1px #EFEFEF !important;
    -moz-box-shadow: 0px 1px #EFEFEF !important;
    -webkit-box-shadow: 0px 1px #EFEFEF !important;
    background: #E6E6E6 !important;
    background: -moz-linear-gradient(top, #FFFFFF 1px, #F3F3F3 1px, #E6E6E6) !important;
    background: -webkit-gradient(linear, 0 0, 0 100%, color-stop(0.02, #FFFFFF), color-stop(0.02, #F3F3F3), color-stop(1, #E6E6E6)) !important;
    font-size: 13px !important;
    margin-right: 5px !important;
    text-decoration: none !important;
    display: inline-block;
    margin-bottom: 5px;
    text-align: center;
    font-weight: bold;
}

.wp-pagenavi a:hover {
    color: #fff !important;
    text-shadow: 0px 1px #4E802C !important;
    border-color: #246489 !important;
    background: #7db9e8 !important;
    background: -moz-linear-gradient(top, #7db9e8 0%, #3894ca 99%) !important;
    background: -webkit-linear-gradient(top, #7db9e8 0%, #3894ca 99%) !important;
    box-shadow: 0px 1px #E7E7E7 !important;
    -moz-box-shadow: 0px 1px #E7E7E7 !important;
    -webkit-box-shadow: 0px 1px #E7E7E7 !important;
}

.wp-pagenavi span.current {
    display: inline-block;
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    font-weight: bold;
    border: solid 1px #DCDCDC !important;
    color: #fff !important;
    box-shadow: 0px 1px #E7E7E7 !important;
    -moz-box-shadow: 0px 1px #E7E7E7 !important;
    -webkit-box-shadow: 0px 1px #E7E7E7 !important;
    margin-right: 5px !important;
    text-shadow: 0px 1px #4E802C !important;
    border-color: #246489 !important;
    background: #7db9e8;
    background: -moz-linear-gradient(top, #7db9e8 0%, #3894ca 99%);
    background: -webkit-linear-gradient(top, #7db9e8 0%, #3894ca 99%);
}