﻿#YPMiddleWrapper {
    padding:0 20px;
}
h3, h4 {
    color:#605d5d;
    padding:10px 0;
}
#YPRegionIndicator, #YPCG, .YPCategoryContainer {
    border:2px solid #ffd800;
    padding:10px;
    margin-bottom:10px;
    position:relative;
}
.MiddleFrame {
    position:relative;
}
.MiddleFrame input {
    border:1px solid silver;
    padding:5px;
}
.YPCategoryContainer {
    margin: 10px;
}
    .YPCategoryContainer a {
        display:inline-block;
        padding: 5px 10px;
        -moz-transition: all .5s;
        -o-transition: all .5s;
        -webkit-transition: all .5s;
        transition: all .5s;
    }
        .YPCategoryContainer a:hover {
            background-color:#EBE8E8;
        }
#YPRegionSelectorTitle {
    padding:5px 0px;
}
    #YPRegionIndicator span {
        float:right;
        margin-right:1px;
    }
        #YPRegionIndicator span:first-child {
            float:left;
        }
        #YPRegionIndicator span img {
            margin-left:10px;
            margin-top:5px;
        }
    #YPRegionIndicator #ddlregion {
        position:absolute;
        right: 15px;
        top: 50px;
    }
.DDLContainer ul li {
    float:left;
    width: 130px;
}
.divider {
    margin:10px 0;
    height:1px;
    background-color:#ffd800;
}
.DDLContainer div {
    width:140px;
}
.DDLContainer ul {
    width:150px;
}
.RegionList img {
    margin-left:5px !important;
}
.YPCGList {
    list-style-type:none;
}
    .YPCGList li a {
        padding: 5px 10px;
        display: block;
        -moz-transition: all .5s;
        -o-transition: all .5s;
        -webkit-transition: all .5s;
        transition: all .5s;
    }
        .YPCGList li a:hover {
            background-color:#EBE8E8;
        }
#MRYPList ul {
    list-style-type:none;
}
    #MRYPList ul li {
        float:left;
        padding:5px;
        width:100px;
    }
        #MRYPList ul li img {
            width:100%;
            height:75px;
        }
.YPhr {
    border: 0 none;
    height: 2px;
    margin: 20px 0;
}
.noBorder {
    border:0 !important;
}
.noPadding {
    padding:0 !important;
}
.YPListContainer {
    padding: 10px;
    border-top: 1px solid #EBE8E8;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    -webkit-transition: all .5s;
    transition: all .5s;
}
    .YPListContainer:hover {
        background-color:#EBE8E8;
    }
    .YPListContainer img {
        height:80px;
        float:left;
        margin-right:10px;
    }
    .YPListContainer .YPTitle {
        color:#3d377e;
        font-weight:bold;
    }
    .YPListContainer .YPETitle {
        color:#808080;
        font-weight:bold;
    }
    .YPListContainer .YPPhone {
        color:#c47050;
        font-weight:bold;
    }
    .YPListContainer .YPCategory {
        color:#3694A5;
    }
    .YPListContainer .YPWeb {
        display:inline-block;
        margin-left:20px;
    }
        .YPListContainer .YPWeb a {
            color:blue;
        }
        .YPListContainer .YPWeb a:hover {
            text-decoration:underline;
        }
#YPSearchContainer {
    border: 2px solid silver;
    margin: 0 10px;
    overflow: hidden;
    padding:10px;
    margin-bottom:10px;
}
    #YPSearchContainer input {
        width:80%;
        padding:5px;
        border:1px solid silver;
        float:left;
        margin:0;
    }
    #YPSearchContainer img {
        position:absolute;
    }
    #YPSearchContainer a {
        background-color: silver;
        display: block;
        color: white;
        font-weight: bold;
        padding: 2px;
        border: 1px solid silver;
        float: right;
        width: 15%;
        text-align: center;
    }
.YPPager {
    margin-top:20px;
}
.BoardListContainer {
    border-bottom:1px solid #EBE8E8;
}
.YPNameContainer {
    border:2px solid #ffd800;
    padding:10px;
    margin:10px;
    position:relative;
}
    .YPNameContainer .YPName {
        display:block;
        font-size:14px;
    }
    .YPNameContainer .YPEName {
        color:#3d377e;
    }
.YPOtherInfoContainer {
    margin: 0px 10px 20px 10px;
    height:150px;
}
.YPOtherInfoContainerEdit {
    height:auto;
}
    .YPOtherInfoContainerEdit .row {
        height:42px !important;
    }
        .YPOtherInfoContainerEdit .row .cell {
            height:42px !important;
        }
        .YPOtherInfoContainerEdit .row .NestedTitle {
            height:42px !important;
            padding-top: 8px !important;
        }
    .YPOtherInfoContainer img {
        float: left;
        height: 100%;
        margin-right: 10px;
    }
    .YPOtherInfoContainer .NestedContainer {
        display: block;
        height: 100%;
        /*overflow:hidden;*/
        /*width: 63%;*/
    }
        .YPOtherInfoContainer .NestedContainer .row {
            border:1px solid silver;
            border-bottom:0;
            height: 29px;
            overflow: hidden;
            margin-left: 0;
            margin-right: 0;
        }
            .YPOtherInfoContainer .NestedContainer .row .cell {
                width:50%;
                overflow:hidden;
                height:30px;
                float:left;
            }
            .YPOtherInfoContainer .NestedContainer .row .NestedTitle {
                background-color: #EBE8E8;
                float: left;
                height: 28px;
                padding-top: 5px;
                text-align: center;
                width: 100px;
            }
            .YPOtherInfoContainer .NestedContainer .row .NestedContent {
                display: block;
                height: 25px;
                margin-left: 110px;
                padding-top:5px;
            }
               
                    .YPOtherInfoContainer .NestedContainer .row .NestedContent a:hover {
                        text-decoration:underline;
                    }
            
        .YPOtherInfoContainer .NestedContainer .Height80 {
            height:80px !important;
        }
.NestedContent select {
    padding:5px;
}
.NestedContent input {
    width: 70%;
}
.title_desc {
    color : #605d5d;
    font-weight : 400;
    font-size : 13px;
}
.lastrow {
    border-bottom:1px solid silver !important;
    height:28px !important;
}
.UpdateInfo {
    text-align:right;
    margin-right:10px;
}
.YPSection {
    margin:0 10px 10px 10px;
    background-color:#EBE8E8;
    padding:5px;
}
    .YPSection .InnerSection {
        background-color: #FFFFFF;
        line-height: 20px;
        padding: 40px 20px 20px;
        position: relative;
    }
        .YPSection .InnerSection .InnerSectionTab {
            background-color: #EBE8E8;
            left: 0;
            padding: 0 20px 5px 10px;
            position: absolute;
            top: 0;
            -webkit-border-bottom-right-radius: 10px;
            border-bottom-right-radius: 10px;
            -webkit-border-top-left-radius: 10px;
            border-top-left-radius: 10px;
        }
.Buttons {
    text-align:center;
}
.margintop5 {
    margin-top:5px;
}
.InnerSectionContentIntro img {
    max-width:100%;
    display:block;
    margin:auto;
    padding-top:10px;
}
.bizEventTitle {
    font-size:14px;
    font-weight:bold;
}
#map_canvas {
    width:100%;
    height:400px;
}
.BusinessTitle {
    font-weight:bold;
}
.YPNameContainer input {
    padding:5px;
    width:70%;
    border:1px solid silver;
}
.YPNameContainer select {
    padding:5px;
}
.marginRight20 {
    margin-right:20px;
}
.YPNameContainer .CategoryContainer {
    font-size:14px;
    font-weight:bold;
    margin-bottom:5px;
    display:inline-block;
}
.NestedContainer .group {
    float: left;
    height: 34px;
    overflow: hidden;
}
.subTitle {
    padding:0px;
}
.subContent {
    padding:0px 20px 0px 5px;
}
.subContent select {
    padding:5px;
}
.FreeSection {
    border:2px solid #0d18d9;
}
.PaidSection {
    border:2px solid #b92323;
}
.blue {
    color:blue;
}
.red {
    color:red;
}
.yellow {
    color:#ffd91f;
}
.payInfo {
    margin:15px 10px 0 10px;
}
.WriteBodySection {
    padding:5px 0;
    position:relative;
}
    .WriteBodySection .WriteSubject {
        width:100px;
        position:absolute;
        padding:2px 0;
    }
    .WriteBodySection .WriteContent {
        margin-left:101px;
    }
.PaidYellowPageContainer {
    padding:10px;
    font-size:14px;
    font-weight:bold;
    background-color:white;
}
.InnerSectionContent {
    position:relative;
}
.WaitFrame {
    display: none;
    position: absolute;
    text-align: center;
    top: 0;
    width:100%;
    height:100%;
}
progress, #IEConfirmButtonContainer, #IEConfirmButtonContainer2, #IEConfirmButtonContainer3 {
    bottom: 0;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 10;
}
#IEConfirmButtonContainer, #IEConfirmButtonContainer2, #IEConfirmButtonContainer3 {
    background-color: #EBE8E8;
    display: none;
    height: 50px;
    padding: 20px;
    position: absolute;
    top: 0;
    width: 240px;
}
#IEConfirmButtonContainer #Confirm, #IEConfirmButtonContainer2 #Confirm2, #IEConfirmButtonContainer3 #Confirm3 {
    margin-right: 10px;
}
#IEConfirmButtonContainer #Confirm, #IEConfirmButtonContainer #Cancel, #IEConfirmButtonContainer2 #Confirm2, #IEConfirmButtonContainer2 #Cancel2, #IEConfirmButtonContainer3 #Confirm3, #IEConfirmButtonContainer3 #Cancel3 {
    background-color: silver;
    color: black;
    cursor: pointer;
    display: inline-block;
    margin-top: 5px;
    padding: 5px 10px;
    /*transition: all 0.5s ease 0s;*/
}
#WaitFrameBackground, #WaitFrameBackground2, #WaitFrameBackground3, #WaitFrameBackground4 {
    background-color: gray;
    height: 100%;
    opacity: 0.5;
    position: absolute;
    width: 100%;
    z-index: 5;
    top:0;
}
.PaidYellowPageComment {
    margin-left:20px;
}
.Error
{
    border:1px solid red !important;
}
#YPFullScreenBackground {
    background-color:black;
    opacity:.3;
    display: block;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 100;
}
/*#ErrorContainer
{
    width:250px;
    height:190px;
    display:inline-block;
    border:2px solid silver;
    position:relative;
    background-color:white;
    padding:10px;
    z-index:200;
}
    #ErroContainer ul li
    {
        color:red;
    }*/
#YPNoticeClose, .DeleteLogo
{
    padding:5px 10px;
    background-color:#EBE8E8;
    cursor:pointer;
}
    #YPNoticeClose:hover, .DeleteLogo:hover
    {
        background-color:silver;
    }
.PaidSection #BizLogo
{
    height:150px;
}

i {
    color:#ccc;
}

.rating {
    transform: rotateY(180deg);
    display: flex;
    float:left;
    padding:20px;
}

    .rating input {
        display:none;
    }
    .rating label {
        display: block;
        cursor: pointer;
        width:50px;
    }
    .rating label:before  {
        content: '\f005';
        font-family: FontAwesome;
        position: relative;
        display: block;
        font-size: 50px;
        color: #ccc;
    }
    .rating label:after  {
        content: '\f005';
        font-family: FontAwesome;
        position: absolute;
        display: block;
        font-size: 50px;
        color: #ffd91f;
        top: 20px;
        opacity: 0;
        transition: .5s;
        text-shadow: 0 2px 5px rgba(0,0,0,.5);
    }
        .rating label:hover:after,
        .rating label:hover ~ label:after, 
        .rating input:checked ~ label:after 
        {
            opacity: 1;
        }
    
.ReviewBox {
    padding: 10px 0 20px;
    border-bottom: 1px solid #ccc;
}
.ReviewRating {
    float:left;
    padding:5px;
}
.ReviewComment {
    clear:both;
}
.CommentDeleteBoard {
    float:right;
    padding:5px;
    color:#698ad8;
    cursor:pointer;
}
    .CommentDeleteBoard:hover {
        background-color: #EBE8E8;
    }

/* 업소 평가하기 수정 업데이트 중... */
/*.CommentDeleteBoard, .CommentEditBoard {
    float:right;
    padding:5px;
    color:#698ad8;
    cursor:pointer;
}
    .CommentDeleteBoard:hover, .CommentEditBoard:hover {
        background-color: #EBE8E8;
    }
/* Member card offer badge/banner (shown on Yellowpage listings enrolled in the card program) */
.card-offer-imagewrap {
    position: relative;
    display: inline-block;
}
.card-offer-ribbon {
    position: absolute;
    top: 8px;
    right: 8px;
    background: #f58021;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 999px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.25);
}
.card-offer-banner {
    background: #f58021;
    color: #fff;
    font-size: 12.5px;
    font-weight: 700;
    text-align: center;
    padding: 5px 8px;
}

.show {
    opacity: 1 !important;
    z-index: 10;
    background: white;
    border: 1px solid #000;
}
/* Yukaridaki blogun ardinda, hicbir yorumu acmayan bir yorum-kapatma
   isareti duruyordu. Tarayici onu sozdizimi hatasi sayar ve kendini
   toparlayana kadar hemen ardindan gelen kurali yutar - buraya
   eklenen ilk kural boyle sessizce kayboldu. Isaret kaldirildi. */

/* ------------------------------------------------------------------
   Two things on the business detail screen were leaning out of the
   middle column and over the sidebar.

   The first is ours. YPOtherInfoContainer carries bootstrap's
   container class, which is a fixed 1170px meant for the outermost
   wrapper of a page. Nested inside a 750px column it simply keeps its
   1170 and hangs 430px out to the right. It only needs the margins it
   already has of its own.

   The second comes in with the writing. People paste a posting in from
   wherever they found it, and the paste brings that site's markup with
   it - this one arrived from the City of Toronto careers pages with
   style="... float: left; width: 970px" baked into a wrapper div. Our
   own stylesheet cannot outrank an inline width, but max-width caps the
   used width whatever the width property says, so the pasted block
   folds back into the column and the text rewraps.

   Measured afterwards at 1280, 900 and 414 wide: nothing crosses the
   column edge and the page never scrolls sideways.
   ------------------------------------------------------------------ */

.YPOtherInfoContainer.container {
    width: auto;
    padding-left: 0;
    padding-right: 0;
}

.InnerSectionContent * {
    max-width: 100% !important;
}

/* ------------------------------------------------------------------
   The box beside the logo, once it stopped being 1170px wide.

   Its inner column carried an inline width of 63 per cent, a figure
   that was chosen while the box was still spilling out of its column
   at bootstrap's fixed 1170. Sixty-three per cent of 1170 leaves room
   for two labelled cells side by side; sixty-three per cent of the 730
   the box actually gets leaves each cell 148px, and the labels alone
   are a fixed 100px. The address and the blog link sat on top of one
   another.

   The column has no reason to be a percentage of anything. The logo
   floats to its left, so it is given whatever is left over instead -
   overflow makes it keep beside the float rather than run underneath.

   Measured on two businesses at 1280 and at 1000 wide: cells went from
   148px to 283px, and no label overlaps its value at any of them.
   ------------------------------------------------------------------ */

.YPOtherInfoContainer .NestedContainer {
    width: auto !important;
    overflow: hidden;
}