@charset "UTF-8";
/* CSS Document */


@media screen and (max-width:738px){
    
    body {
        font-size: 3.2vw;
    }
    .row {
        width: 90%;
        margin-left: 5%;
    }
    .spOnly {
        display: block;
    }
    .pcOnly {
        display: none;
    }
    
    #headerSpecial {
        height: 14.5vw;
    }
    #headerSpecial .logobase {
        padding-left: 0em;
    }
    #headerSpecial .logobase a img {
        height: 14vw;
        width: auto;
    }
    main {
        font-size: 3.7vw;
    }
    #topTitArea h1#topTit {
        width:100%;
        margin-bottom:1em;
    }
    #topImage {
        margin-bottom: 0em;
    }
    #topImage ul {
        height: 50vw;
    }
    #topImage ul li {
        height: 50vw;
    }
    #topTit img {
        width:100%;
    }
    #leadCopyArea {
        width: 100%;
        flex-direction: column;
    }
    #leadCopyArea img {
        width: 90%;
        margin-bottom: 1em;
        height: auto;
    }
    #leadCopyArea h2 {
        padding-left: 0em;
        font-size: 4vw;
    }
    .photoBlock {
        width: 100%;
    }
    .photoBlock .flxbox {
        flex-direction: column;
    }
    .photoBlock figure.vrtcal {
        width: 100%;
    }
    .photoBlock figure.portlate {
        width: 60vw;
        margin-left: auto;
        margin-right: auto;
    }
    .photoBlock figure img {
        width: 100%;
        height: auto;
    }
    .copyBlock .flxbox {
        flex-direction: column;
    }
    .copyBlock p {
        line-height: 160%;
    }
    .copyBlock.Atype, .copyBlock.Btype, .copyBlock.Ctype, .copyBlock.Dtype {
        width: 100%;
        flex-direction: column;
    }
    .copyBlock.Ctype p {
        margin-bottom: 2em;
    }
    .copyBlock.Btype p, .copyBlock.Ctype p {
        width: 100%;
    }
    .copyBlock.Btype figure.portlate,.copyBlock.Ctype figure.portlate {
        width:60vw;
        margin-bottom: 2em;
        margin-left: auto;
        margin-right: auto;
    }
    #profileAreaShort img {
        margin-left: 1em;
        margin-right: 1em;
    }
    figure.portlate img {
        width: 100%;
        height: auto;
    }
    #profileArea, #profileAreaShort {
        width:90%;
        flex-direction: column;
    }
    #profileArea .profileBlock, #profileAreaShort .profileBlock {
        width: 100%;
    }
    #profileArea .profileBlock#profile01, #profileAreaShort .profileBlock#profile01 {
        margin-bottom: 1em;
        order: 2;
    }
    #profileArea .profileBlock#profile02 {
        order: 3;
    }
    #profileArea img, #profileAreaShort img {
        width: 100%;
        margin-bottom: 1em;
        height: auto;
        order: 1;
    }
    .sns_box {
        width: 90%;
        margin-bottom: 2em;
        margin-left: auto;
        margin-right: auto;
    }
    #videoArea {
        display: flex;  
        align-items: center;  
        justify-content: space-between;
        margin: 0 auto 4em ;  
        color: #727171;  
        background-color: #DFE7ED;
    }
    #videoArea .videoRight {
        width: 50%;
    }
    #videoArea .videoRight img {
        width: 100%;
        height: auto;
    }
    #videoArea .videoLeft {
        padding-left: 0.7em;
    }
    #videoArea .videoLeft h3 {
        line-height: 180%; 
        font-size: 80%;
    }
    #calamSpcial.row {
        width: 100%;
        margin-left: 0px;
    }
    #calamSpcial .titArea {
        flex-direction: column;
    }
    #calamSpcial .titArea h2 {
        font-size: 180%;
        line-height: 120%;
        margin:0;
    }
    #calamSpcial .titArea p {
        margin-right: 0em;
        margin-bottom: 0em;
        font-size: 90%;
    }
    #calamSpcial .contentsArea .flxbox {
        flex-direction: column;
    }
    #calamSpcial .contentsArea p {
        line-height: 160%;
    }
    #calamSpcial .contentsArea .Atype p {
        width:100%;
    }
    #calamSpcial .contentsArea figure.cBlockImg {
        width: 100%;
        margin-right: 0em;
        margin-top: 0em;
    }
    #calamSpcial .contentsArea figure img {
        width: 100%;
        height: auto;
    }
    #spotTravel ul#spotBox {
        flex-direction: column;
    }
    #spotTravel ul#spotBox li {
        width: 100%
    }
    #spotTravel ul#spotBox li h5 {
        font-size: 6.4vw;
        margin-bottom: 0em;
    }
    #spotTravel ul#spotBox li img {
        width: 100%;
        height: auto;
    }
    ul#linkArea {
       flex-direction: column; 
    }
    ul#linkArea li {
        width: 100%;
    }
    h4.titShoulder {
        width: 70%;
    }
    #productionArea .flxbox {
        flex-direction: column;
    }
    #productionArea #productCopy {
        width: 100%;
    }
    #productionArea .productPhoto {
        width: 100%;
        margin-right: 0em;
        padding-top: 0em;
    }
    #productionArea .productPhoto img {
        width: 100%;
        height: auto;
    }
    h4#productName img {
        width: 60vw;
        height: auto;
    }
    
    #bottomLink ul li {
    }
    #bottomLink ul li a p {
        display: none;
        margin-right: 0em;
    }
    #bottomLink ul li#realTabirealTabi .logoSpace img {
        width:16vw;
        height: auto;
    }
    #bottomLink ul li#realStyle .logoSpace img {
        width: 24vw;
        height: auto;
        margin-top: 0.6em;
    }
    /*#bottomMenu .hideMenu {
        display: block;
    }*/
    #bottomMenu .mapList {
        display: none;
    }
    .bnTitle p.bnContent {
        font-size: 140%;
    }
    #bottomMenu .hideMenu ul.bnList li a img {
        width: 16vw;
        height: auto;
    }
    #bottomMenu .hideMenu ul.bnList {
        height: auto;
    }
    #bottomMenu #tagBackNumb {
        width: 40vw;
        margin-left: 0.7em;
        padding-bottom: 0.4em;
        padding-top:0.4em;
        font-size: 2.4vw;
    }
    .speckIndentPC {
        margin-left:0em;
    }
    
    
}

@media screen and (max-width:896px) and (min-width:739px){
    
    html, body {
        width: 100%;
        overflow-x: hidden;
    }
    .row {
        width:96%;
    }
    main {
        font-size: 1.88vw;
    }
    #headerSpecial {
        height: 8.1vw;
    }
    #headerSpecial .logobase {
        padding-left: 0em;
    }
    #headerSpecial .logobase a img {
        height: 8vw;
        width: auto;
    }
    #topImage {
        margin-bottom: 2em;
    }
    #topImage ul {
        height: 50vw;
    }
    #topImage ul li {
        height: 50vw;
    }
    #topTitArea h1#topTit {
        width:98%;
        margin-right: 0;
    }
    #topTitArea h1#topTit img {
        width:100%;
        height: auto;
    }
    #leadCopyArea {
        width: 96%;;
    }
    #leadCopyArea img {
        width:24%;
        height: auto;
    }
    .copyBlock.Atype, .copyBlock.Btype, .copyBlock.Ctype, .copyBlock.Dtype {
        width: 100%;
    }
    .photoBlock {
        width: 100%;
    }
    .photoBlock img.imgW100 {
        width: 100%;
        height: auto;
    }
    .photoBlock img.imgW56 {
        width: 54vw;
        height: auto;
    }
    .photoBlock img.imgW42 {
        width: 40vw;
        height: auto;
    }
    .photoBlock img.imgH23v {
        height: 27.5vw;
        width: auto;
    }
    .photoBlock img.imgH35v {
        height: 41.2vw;
        width: auto;
    }
    .photoBlock img.imgH29v {
        height: 34.6vw;
        width: auto;
    }
    .photoBlock img.imgH336v {
        height: 39vw;
        width: auto;
    }
    .photoBlock img.imgH36v {
        height: 43vw;
        width: auto;
    }
    .photoBlock img.imgH32v {
        height: 37vw;
        width: auto;
    }
    .copyBlock.Btype > p, .copyBlock.Ctype > p {
        width: 66%;
    }
    .copyBlock.Btype figure.portlate, .copyBlock.Ctype figure.portlate {
        width: 30%;
    }
    .copyBlock.Btype figure.portlate img, .copyBlock.Ctype figure.portlate img {
        width: 100%;
        height: auto;
    }
    #profileAreaShort {
        width:96%;
    }
    #profileArea img, #profileAreaShort img {
        width: 33%;
        height: auto;
    }
    .sns_box {
        width: 96%;
    }
    #videoArea .videoRight {
        width: 50%;
    }
    #videoArea .videoRight img {
        width: 100%;
        height: auto;
    }
    #calamSpcial .contentsArea .calamBlock.Atype figure.cBlockImg img {
        width: 30vw;
        height: 25vw;
    }
    #spotTravel ul#spotBox li img {
        width: 30vw;
        height: auto;
    }
    #productionArea .productPhoto img {
        width: 40vw;
        height: auto;
    }
    #bottomMenu .hideMenu .mapList img {
        width: 46vw;
        height: auto;
    }
    #bottomMenu .hideMenu ul.bnList {
        height: 50vw;
    }
    #productionArea #productCopy {
        width: 54%;
    }
}
