@import "common.css";

/* 丹念仕込み特設サイト */
/* うどんファンが語る丹念の魅力 */

#navHeader {
    display:none;
}

.fb-like iframe {
    z-index:1;
}


/* PCレイアウト */
/*-------------------------------------------------------------------------------------------*/

/* title */
#title {
    width:100%;
    background:#b49c3d;
}
#title_inner {
    position:relative;
    max-width:950px;
    height:auto;
    margin:0 auto;
}
#title_inner h1 {
    display:block;
    width:86.315%;
    height:0;
    background-repeat:no-repeat;
    background-position:left top;
    background-size:contain;
    background-image:url("../images/udonwave/title.png");
    padding-top:21.05%;
    text-indent:-9999px;
}

/* text setting */
.section_inner .txt {
    width:90%;
    max-width:680px;
    margin:0 auto 5%;
    text-align:left;
}
.section_inner h2 {
    background:#b49c3d;
    background:-moz-linear-gradient(left, #b49c3d 0%, #ffffff 100%);
    background:-webkit-linear-gradient(left, #b49c3d 0%,#ffffff 100%);
    background:linear-gradient(to right, #b49c3d 0%,#ffffff 100%);
    margin-bottom:0.5em;
    padding:0 0.5em;
    line-height:1.8;
    font-size:1.8em;
    color:#fff;
}
.section_inner h3 {
    margin-bottom:0.5em;
    border-bottom:1px solid #000;
    line-height:1.6;
    font-size:1.6em;
}
.section_inner p {
    margin-bottom:1.0em;
    line-height:2.0;
    font-size:1.2em;
}

.section_inner p.lead {
    margin-bottom:1.5em;
    padding-top:5%;
    font-size:1.4em;
}


/* main image */
.section_main {
    width:100%;
    height:600px;
    background-repeat:no-repeat;
    background-position:center top;
    background-size:cover;
    background-image:url("../images/udonwave/main_img.jpg");
    margin-bottom:3%;
}
.section_main p {
    font-size:0;
    text-indent:-9999px;
}



/* balloon */
.section_balloon {
    width:90%;
    max-width:680px;
    margin:0 auto 5%;
}
.balloon {
    background-color:#ede6d1;
    background-repeat:no-repeat;
    background-position:right 15px bottom 15px;
    background-size:120px;
    padding:20px 20px 120px;
    border-radius:8px;
    box-sizing:border-box;
    text-align:left;
    font-size:1.1em;
}
.balloon span {
    color:#ff0000;
}
.balloon .name {
    padding-top:0.5em;
    font-size:0.9em;
}

.bln01 {background-image:url("../images/udonwave/icon01.png");}
.bln02 {background-image:url("../images/udonwave/icon02.png");}
.bln03 {background-image:url("../images/udonwave/icon03.png");}
.bln04 {background-image:url("../images/udonwave/icon04.png");}
.bln05 {background-image:url("../images/udonwave/icon05.png");}
.bln06 {background-image:url("../images/udonwave/icon06.png");}
.bln07 {background-image:url("../images/udonwave/icon07.png");}
.bln08 {background-image:url("../images/udonwave/icon08.png");}

.bln01,
.bln03,
.bln_left {
    float:left;
    width:48%;
}
.bln02,
.bln04,
.bln_right {
    float:right;
    width:48%;
}

.bln05 {
    margin-bottom:8%;
}
.bln07 {
    min-height:100%;
}

.bln08 {
    clear:both;
}

.bln_right,
.bln_left {
    margin-bottom:4%;
}


/* image section */
.section_img {
    width:100%;
    margin-bottom:5%;
}
.section_img ul {
    padding-top:0.3em;
    text-align:center;
}
.section_img ul li {
    display:inline-block;
    width:13em;
    margin:0;
    text-align:left;
    font-size:1.0em;
}
.section_img ul li:first-child {
    text-align:right;
}

.img01 {
    width:100%;
    height:450px;
    background:url("../images/udonwave/img01_02.jpg") no-repeat center top;
    background-size:cover;
}
.img02 {
    width:100%;
    height:450px;
    background:url("../images/udonwave/img03_04.jpg") no-repeat center top;
    background-size:cover;
}


.banner {
    width:70%;
    max-width:327px;
    margin:0 auto 5%;
}

.sp_img,
.sp_bln {
    display:none;
}


/* 2000px以下 */
/*-------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 2000px) {

.img01,
.img02 {
    height:0;
    background-size:contain;
    padding-top:22.5%;
}

}
/*-------------------------------------------------------------------------------------------*/
/* 949px以下 END */


/* 949px以下 */
/*-------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 949px) {




}
/*-------------------------------------------------------------------------------------------*/
/* 949px以下 END */



/* 768px以下 */
/*-------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 768px) {






}
/*-------------------------------------------------------------------------------------------*/
/* 768px以下 END */



/* 640px以下 */
/*-------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 640px) {

ul#sns_top {
    position:static;
    width:98%;
    margin:0 1%;
    padding-top:0;
}


/* title */
#title {
}
#title_inner {
    padding:2% 0 0 2%;
}
#title_inner h1 {
    width:80.0%;
    background-size:contain;
    background-image:url("../images/udonwave/title_sp.png");
    margin-bottom:10px;
    padding-top:17.333%;
}


/* main image */
.section_main {
    height:0;
    background-size:contain;
    background-image:url("../images/udonwave/main_img_sp.jpg");
    padding-top:133.33%;
}

.section_img,
.pc_bln {
    display:none;
}

.sp_img,
.sp_bln {
    display:block;
}

.section_inner p.lead {
    font-size:1.2em;
}

.sp_img {
    margin-bottom:8%;
}
.sp_img span {
    display:inline-block;
    width:90%;
    margin:0 auto;
    text-align:left;
    font-size:0.9em;
}

/* balloon */
.section_balloon {
    width:100%;
    margin:0 auto;
}
.balloon {
    background-size:100px;
    padding:20px 20px 120px;
    font-size:1.0em;
}

.bln01,
.bln02,
.bln03,
.bln04 {
    float:none;
    width:90%;
    margin:0 auto 8%;
}

.bln05,
.bln06,
.bln07,
.bln08 {
    width:90%;
    margin:0 auto 8%;
}

.bln_left,
.bln_right {
    float:none;
    width:100%;
    margin:0 auto;
}



}
/*-------------------------------------------------------------------------------------------*/
/* 640px以下 END */



/* - 375px */
/*-----------------------------------------------------------*/
@media only screen and (max-width: 375px) {










}
/* - 375px end */



/* - 320px */
/*-----------------------------------------------------------*/
@media only screen and (max-width: 320px) {










}
/* - 320px end */